Javascript-форум - Выборка значений option select'a

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - Выборка значений option select'a (https://javascript.ru/forum/jquery/36080-vyborka-znachenijj-option-select%27.html)

Выборка значений option select'a

У меня на странице есть несколько форм (10) с идентичными select'ами. Нужно сделать проверку на изменение перед отправкой данных на сервер. Посоветуйте, пожалуйста, как лучше сделать.
Я пошел таким путем.

if( $('select[name="name"]').val()== 0 ){
                    notify( 'Укажите раздел для всех елементов' , 'error');
} 
                else  { sendFormToServer( );

после этого хочу навешать класс на все формы где селект не был изменен. И с этим как-то проблема))

Есть вариант с событием on.change? но как тогда отлавливать это изменение перед ПОСТом...?

Как бы вы сделали?

Цитата:

Сообщение от Юрай

Посоветуйте, пожалуйста, как лучше сделать.

Сделать нормальный тестовый пример и нормально описать проблему...

<div class="form">
<select>
  <option value="0">Choose...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3" selected>3</option>
</select>
</div>

<div class="form">
<select>
  <option value="0" selected>Choose...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
</div>


<div class="form">
<select>
  <option value="0" selected>Choose...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
</div>

допустим вот три таких формы. Мне нужно выбрать те формы, селекты которых не изменены, то есть те где option.val == 0

<style>
    .form{
        margin: 10px 0;
        -webkit-transition: box-shadow 0.5s;
        -moz-transition: box-shadow 0.5s;
        transition: box-shadow 0.5s;
    }
    .form.error{
        box-shadow: 0 0 5px #f00;
        border-radius: 3px;
    }
</style>
<div class="form">
<select>
  <option value="0">Choose...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3" selected>3</option>
</select>
</div>
 
<div class="form">
<select>
  <option value="0" selected>Choose...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
</div>
 
 
<div class="form">
<select>
  <option value="0" selected>Choose...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
</div>
<script src="//code.jquery.com/jquery-latest.js"></script>
<script>
    function submit() {
        var valid = true;
        $('.form').each(function(){
            if ($('select', this).val() == 0) {
                $(this).addClass('error');
                valid = false;
            } else {
                $(this).removeClass('error');
            }
        });
        if (valid) {
            // submit
        } else {
            // notify
        }
    }
</script>
<button onclick="submit()">Отправить</button>

Спасибо тебе большое. А то я уже накостылил))