Удалить выбранные элементы из других входов выбора

Question

У меня есть проблема с выбором элементов ввода.

То, что я хочу достичь, - это динамическое удаление уже выбранных параметров из других полей выбора, чтобы я не мог выбрать один и тот же элемент в нескольких блоках. Проблема в том, что элементы загружаются в массив через AJAX, и мне нужно заполнить выбранный ввод опциями после. Это делает его намного сложнее.

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

у меня есть скрипку, а это, как далеко я получил: http://jsfiddle.net/P3j4L/

Answer 1

Вы можете попробовать что-то вроде этого

function updateSelects() 
{ 
    $('.selectContainer .select').each(
    function (i, elem) 
    { 
     // Get the currently selected value of this select 
     var $selected = $(elem).find("option:selected"); 
     // Temp element for keeping options 
     var $opts = $("<div>"); 
     // Loop the elements array 
     for (i = 0; i < selectElements.length; i++) 
     { 
      var value = selectElements[i]; 
      // Check if the value has been selected in any select element 
      if ($selected.val() == value || !$('.select option[value=' + value + ']:selected').length) 
      { 
       // if not create an option and append to temp element 
       $opts.append('<option value="' + value + '">' + value + '</option>'); 
      } 
     } 
     // replace the html of select with new options 
     $(elem).html($opts.html()); 
     if ($selected.length) 
     { 
      // set the selected value if there is one 
      $(elem).val($selected.val()); 
     } 
     else 
     { 
      // new select element. So remove its selected option from all other selects 
      $('.selectContainer .select').not(this).find('option[value=' + $(elem).val() + ']').remove(); 
     } 
    } 
); 
} 

посмотреть демо здесь: http://jsfiddle.net/P3j4L/1/