Проверка выпадающего списка при отправке с использованием jQuery - PullRequest
Новая
       30

Проверка выпадающего списка при отправке с использованием jQuery

0 голосов
/ 22 августа 2011

У меня есть пять раскрывающихся списков с одинаковыми параметрами в моей форме, и должна быть проверка, что раскрывающийся список не может иметь значение, уже выбранное из предыдущего раскрывающегося списка ... 

<select id ="selected" name="expenseType" class="dynamic_select" >
     <option value="0">-select-</option>
     <option value="1">Van</option>
     <option value="2">SUV</option>
     <option value="3">Hatcback</option>
     <option value="4">Jeep</option>
</select>

При отправкекак я могу это проверить?Я использую плагин проверки jQuery для проверки формы.

Ответы [ 3 ]

2 голосов
/ 22 августа 2011

Попробуйте что-то вроде этого 

var isValid = true;
var $dynamicSelect = $("select.dynamic_select");
$dynamicSelect.each(function(){
   if($dynamicSelect.find("option[value="+this.value+"]:selected").length > 1){
      isValid = false;
      return false;
   }
});

Теперь используйте переменную isValid, чтобы отобразить соответствующее сообщение об ошибке, или отправьте форму.

1 голос
/ 22 августа 2011

Вот некоторый скрипт, который использует среду валидатора jQuery, чтобы сделать то, что, я думаю, вы ищете. 

<script type="text/javascript">
    $(function () {
        $.validator.addMethod('uniqueselection', function (v, e, d) {
            if (v == '-select-') {
                return true;
            }
            if ($(".dynamic_select option[value='" + v + "']:selected").size() > 1) {
                return false;
            }
            return true;
        });

        $('select').each(function () {
            $(this).rules('add', { uniqueselection: 'This can be selected once' });
        });
    });
</script>
0 голосов
/ 22 августа 2011

Здесь вы будете предупреждены, если два выбора имеют одинаковое значение, просто используйте пять вместо двух в соответствии с вашими потребностями. 

<script type="text/javascript">
        $(document).ready(function(){
           $('#target').bind('submit', function(){
                if($('#selected1').val() == $('#selected2').val()){
                    alert($('#selected1').val()+" "+ $('#selected2').val());
                }
           }); 
        });
    </script>



 <form method="post" id="target">
 <select id ="selected1" name="expenseType" class="dynamic_select" >
     <option value="0">-select-</option>
     <option value="1">Van</option>
     <option value="2">SUV</option>
     <option value="3">Hatcback</option>
     <option value="4">Jeep</option>
 </select> 
  <select id ="selected2" name="expenseType" class="dynamic_select" >
     <option value="0">-select-</option>
     <option value="1">Van</option>
     <option value="2">SUV</option>
     <option value="3">Hatcback</option>
     <option value="4">Jeep</option>
 </select> 
 <input type="submit" value="submit"/>
</form>
...