Я просто хочу сделать что-то очень простое, это выбор, в зависимости от выбранного параметра, он заполняет второй выбор.
Я всегда делал это, скрывая/показывая выбранные таким образом (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();
};
});
Но теперь я пытаюсь выбрать и не работает. Он удаляет всю выбранную маску и возвращает выбранные значения в native. Я также пробовал это (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');
}
И это тоже не работает. Он не удаляет Chosen, но ничего не делает. Есть идеи по этому поводу? Я знаю, что это звучит довольно основательно, я не мог найти точного ответа на него в любом месте.
PS: Я пытаюсь сделать это с JS, а не через AJAX.
Я предполагаю, что # select_1 должен использовать выбранный плагин. Если это правильно, # select_1 будет иметь стиль отображения: none; применяется к нему, поэтому вы не собираетесь регистрировать на нем какие-либо события "клика".
Если вы посмотрите на "выбранную" документацию, http://harvesthq.github.io/chosen/, вы можете узнать, как зарегистрировать обработчик изменений в выбранном вами элементе.
Если выбранный применяется к # select_2 и # select_3, то переключение видимости этих двух элементов бессмысленно, поскольку они уже скрыты. HTML, отображаемый выбранным плагином, будет иметь элементы контейнера с идентификаторами # select_2_chosen и # select_3_chosen - поэтому переключите их видимость!
В приведенном ниже коде предполагается, что # select_2 и # select_3 имеют класс 'selected'. Я применяю выбранное значение к # 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');