Обновление jQuery Каскадные входы SexyCombo

Question

Использование sexy-combo со странами, а другое с городами. Всякий раз, когда пользователь выбирает страну, я заполняю второй комбинированный список соответствующими городами с помощью Ajax, без какой-либо обратной передачи.

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

Знаете ли вы, какую функцию я должен вызывать, чтобы "обновить" комбинированный список, точно так же, как он будет обновляться при выполнении обратной передачи?

Любой намек очень приветствуется! Большое спасибо.

Answer 1

То, что мне не хватало, вызывает эту функцию:

$.sexyCombo.changeOptions($('#cities')[0]);

Это вынуждает выводить сексуальный комбинированный список городов после того, как я изменил параметры элемента управления html select, к которому привязан JavaScript1004 *

@ Sarzniak и @Majid: большое спасибо за ваши ответы, но это было не совсем то, что я искал, может быть, я не достаточно ясно дал понять.

Answer 2

Создайте другой метод в сценарии, например, ниже "changeOptions":

custom_update: function($select) {
    $select = $($select);
    $select.each(function() {
        if ("SELECT" != this.tagName.toUpperCase()) {
            return; 
        }

        var my_text = $("#"+ this.id + " option:selected").text();
        var my_val = $("#"+ this.id + " option:selected").val();
        var $this = $(this);
        var $wrapper  = $this.parent();
        var $input = $wrapper.find("input[type='text']");
        var $listWrapper = $wrapper.find("ul").parent();

        $listWrapper.removeClass("visible").
        addClass("invisible");
        $wrapper.css("zIndex", "0");
        $listWrapper.css("zIndex", "99999");            

        //$input.val("");
        $wrapper.data("sc:optionsChanged", "yes");
        var $selectbox = $this;
        $selectbox.parent().find("input[type='text']").val($selectbox.find("option:eq(" + my_val + ")").text());
        $selectbox.parent().data("sc:lastEvent", "click");
        $selectbox.find("option:eq(" + my_val + ")").attr('selected','selected');
    });
},

И назовите это как:

$.sexyCombo.custom_update($("#myselectlist"));

Answer 3

Если ваш старый код выглядит так:

$(document).ready(function() {
  $('.sexify').sexify({options});
  $('select[name="countries"]').change(function() {
    var selected_country = $(this).val();
    $('select[name="cities"]').load('cities.php?country=' + selected_country);
  });
});

, тогда все, что вам нужно, это добавить функцию в качестве обратного вызова .load, например:

$(document).ready(function() {
  $('.sexify').sexify({options});
  $('select[name="countries"]').change(function() {
    var selected_country = $(this).val();
    $('select[name="cities"]').load('cities.php?country=' + selected_country, function() {
      $(this).sexify({options});
    });
  });
});

Answer 4

попробуйте использовать «живую» функцию привязки из jQuery.Когда вы обновляете ваш элемент, события больше не связываются с вашими объектами.

пример

$("myItem").live("click",function(){ codeHere });

это также связывает событие click с вашими объектами, созданными в ajax.1006 *