JQuery формы onchange выберите изменения значений - PullRequest
Новая
       27

JQuery формы onchange выберите изменения значений

0 голосов
/ 28 марта 2012

Я ищу лучшее решение этой проблемы. У меня простая магазинная логическая проблема. Есть 2 выбранных элемента, размер и цвет . Я хочу сделать их зависимыми от данных (теперь это пример данных, но позже это будет из базы данных) - размер решит, какие цветовые варианты будут видны для клиента (скрывая ненужные).

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

Во-вторых, я ищу наиболее гибкое решение, так как у меня есть сомнения относительно моего. Вот код: 

       var rozmiar = new Array("S", "M", "L", "XL", "XXL");
   var kolor = new Array("Czerwony", "Niebieski", "Zielony", "Biały", "Czarny");
   var opcje = new Array( rozmiar, kolor);

        $(document).ready(function(){
        $('.form1').change(function(){
                $('.form2 option').show();

                var selectSelector = function(z){
                    selectSelector = $('select.form2 option[value='+kolor[z]+']').hide();
                };

                wybranyRozmiar = $(this).val();
                    if(wybranyRozmiar == rozmiar[0]){
                        selectSelector(0);
                    }
                    if(wybranyRozmiar == rozmiar[1]){
                        selectSelector(1);
                    }
                    if(wybranyRozmiar == rozmiar[2]){
                        selectSelector(2);
                    }
                    if(wybranyRozmiar == rozmiar[3]){
                        selectSelector(3);
                    }
                    if(wybranyRozmiar == rozmiar[4]){
                        selectSelector(4);
                    }
            });
        });

Ответы [ 2 ]

1 голос
/ 28 марта 2012

Я отвечаю на единственную часть, которую я понимаю.

Вместо нескольких операторов if вы можете использовать переключатель 

switch(selectsize) {
   case rozmiar[1]:
       $('select.form2 option[value='+color[2]+']').hide();
       break;
   //case <another>"
       //break;
}
0 голосов
/ 28 марта 2012

Это то, что я понял, что нужно сделать. Выберите соответствующую опцию из .form2 на основе индекса выбранной опции в .form1. 

$('select.form1').change(function (i) {
  var selectedIndex = $('select.form1 option:selected').index();
  $('select.form2 option:eq(' + selectedIndex + ')').attr('selected', 'selected');
});

D3m0: http://jsbin.com/azilow

...