Страницы

Поиск по вопросам

среда, 4 марта 2020 г.

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

#html #jquery #html_select 


Есть несколько списков одинаковых.








Мне нужно сделать так, чтобы когда я в первом выбирал например первое значение это
значение в других списках ставало disabled, или скрывалось.
А если я убираю активность с опции которую выбрал, то во всех селектах появлялся
эта опция для выбора.

Как такое реализовать?


Ответы

Ответ 1


Если я вас правильно понял, вот так работает.



$('.change').on('change',function() {
      $(this).children('option').each(function(){
      var options = $('.change option[value='+$(this).val()+']').not(this);
      if($(this).is(':selected')) {
        $(options).prop('disabled',true);
        $(options).prop('selected',false);
      } else {
        $(options).prop('disabled',false);
      }
  });
});








Ответ 2


Предполагаю, что нужно что-то такое:



let trackingSelect = 'select[name=name]:eq(0)';

$(document).on('change', trackingSelect, function(){	
  let optionValue = this.selectedIndex == 0 ? 'option[value="' + $(this).val()  +
'"]' : 'option[value]';
  let propFlag = this.selectedIndex == 0 ? true : false;     
  $('select[name=name]').not(trackingSelect).find(optionValue).prop('disabled', propFlag);
       
});

/*
$(document).on('change', trackingSelect, function(){	
  let optionValue = 'option[value]';
  let propFlag = false;   
  
  if (this.selectedIndex == 0) {
    optionValue = 'option[value="' + $(this).val()  + '"]';
    propFlag = true;
  }
  $('select[name=name]').not(trackingSelect).find(optionValue).prop('disabled', propFlag);
       
});
*/










Где select[name=name]:eq(0) указывает на первый select, this.selectedIndex == 0 указывает
на первый option в данном select'е (при желании - изменить)

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


Ответ 3


Решение задачи:



$('.change').on('change', function() {
  $(this).children('option').each(function() {
    var option = $(this),
      options = $('.change option[value=' + option.val() + ']').not(this);

    if (!option.is(':disabled')) {
      if (option.is(':selected')) {
        $(options).prop('disabled', true);
        $(options).prop('selected', false);
      } else {
        $(options).prop('disabled', false);
      }
    }

  });

});

Автор: на
Ярлыки: , , ,

Комментариев нет:

Отправить комментарий

Подписаться на: Комментарии к сообщению (Atom)