Зависими избира с Chosen Jquery

Просто искам да направя нещо много просто, което е избор, в зависимост от това коя опция е избрана, той попълва втори избор.

Винаги съм правил това, като скривам/показвам селекти по този начин (JS):

$( document ).ready(function() {    
$("#select_1").change(function() {
        if ($("#select_1").val()=="A") {
        $("#select_2").show();
        $("#select_3").hide(); 
    }

    else if ($("#select_1").val()=="B") {
        $("#select_3").show();
        $("#select_2").hide();
    };
});

Но сега опитвам Chosen и не става. Той премахва всички избрани маски и връща селектираните към оригиналния. Опитах и ​​това (JS):

$(document).ready(function(e) {
  $("#select_2").css('visibility','hidden');
  $(".chosen").chosen();
  $("#select_1").click(function() {
   if ($("#select_1").val()=="A") {
   $("#select_2").css('visibility','visible');

   }

И това също не работи. Не премахва избрания, но не прави нищо. Някаква идея по въпроса? Знам, че звучи доста елементарно, защото никъде не можах да намеря точен отговор.

PS: Опитвам се да го направя с JS, а не чрез AJAX.


javascript jquery jquery-chosen prototype-chosen
person chancar    schedule 29.03.2014    source източник
comment
Има ли плъгин, който използвате за функцията selected()? Ако е така, правилно ли го включвате?   -  person Jay Blanchard    schedule 29.03.2014

Отговори (1)


arrow_upward
1
arrow_downward

Предполагам, че #select_1 е избраният плъгин да се приложи към него. Ако това е правилно, #select_1 ще има стил на показване:няма; приложени към него, така че няма да регистрирате събития за „щракване“ върху него.

Ако погледнете „избраната“ документация, http://harvesthq.github.io/chosen/ , можете да откриете как да регистрирате манипулатор на промяна към избрания от вас елемент.

Ако selected се приложи към #select_2 и #select_3, тогава превключването на видимостта на тези два елемента е безсмислено, защото те вече са скрити. HTML, изобразен от избрания плъгин, ще има контейнерни елементи с идентификатори #select_2_chosen и #select_3_chosen - така че превключете видимостта на тези!

Кодът по-долу предполага, че #select_2 и #select_3 имат класа 'chosen'. Прилагам избраното към #select_1 отделно, за да мога да обвържа събитието за промяна, което трябва да бъде уникално за него. И накрая, задействам събитието за промяна веднага след дефинирането на манипулатора на промяната, така че #select_3_chosen да стане скрит.

$(".chosen").chosen();
$("#select_1").chosen().change(function () {
    var value = $(this).val();
    if (value=="A") {
        $("#select_2_chosen").css('visibility','visible');
        $("#select_3_chosen").css('visibility','hidden');
    } else if (value == "B") {
        $("#select_2_chosen").css('visibility','hidden');
        $("#select_3_chosen").css('visibility','visible');
    } 
}).trigger('change');
person 76484    schedule 29.03.2014
comment
Благодаря, получи се. Но не с .css('visibility','hidden'), а с .hide() - person chancar; 31.03.2014