2012-05-29 3 views
0

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

Например,

<select id="z_one"> 
    <option>1</option> 
    <option>1</option> 
    <option>1</option> 
</select> 

<select id="z_two"> 
    <option>1</option> 
    <option>1</option> 
    <option>1</option> 
</select> 

Есть ли способ для перебора только этих двух выбирает, а не другие, а также проверить соответствие значений?

$('select[id^=z_]').change(function() { 
    var value = $(this); 
    $(this).siblings().each(function() { //this checks all siblings. do not want. 
    if ($(this).val() == value.val()) { 
     alert("You can't select the same value twice."); 
     return false; 
     } 
    }); 
}); 

Этот JQuery код перебирает все выбирает на странице, а не только два, я хочу, чтобы проверить против. Есть ли способ сделать это?

ответ

1

Вместо

$(this).siblings().each(

использования

$(this).next('select[id^=z_]').each(
1

Try какой-то предикат на ваш призыв к братьев и сестер, чтобы ограничить его только эти два выбирает.

Что-то вроде

this.siblings("[id = 'z_two']")

, например.

0

Я немного поменял ваш html.

<select id="z_one" class='groupA'> 
    <option>Select an element</option> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
</select> 

<select id="z_two" class="groupA"> 
    <option>Select an element</option> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
</select> 

Вот код JS:

$(function(){ 

    $('.groupA').change(function(){ 

     var currentID = this.id; 
     var currentVal = $(this).val(); 

     var $options = $('option','.groupA'); 
     var $jThis = $(this); 

     var isMatched = false; 

     $.each($options,function(index,element){ 

      if(element.parentNode.id != currentID){ 

       var $prevDropDown = $('#' + element.parentNode.id); 

       if($prevDropDown.val() == currentVal){ 

        $jThis.get(0).selectedIndex = 0; 
        alert("You can't select the same value twice."); 
        isMatched = true; 
        return false; // to break out from $.each 
       } 


      } 
     }); 

     if(isMatched) 
      return false;  
    }); 


}); 
Смежные вопросы