JQuery AJAX несколько событий выпадающего списка

Question

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

Я думаю, это потому, что .html создает новый домен каждый раз, когда этобеги, но я понятия не имею, как это остановить.Есть идеи?Заранее спасибо.

$(document).ready(function(){
        $("form[name='search_form']").change(function(event){
        if($(event.target).is("#searchregionid")){
            regionid = $("#searchregionid").val();
            searchData = "searchregionid="+regionid;
            searchFor(searchData);
            getCountrySelection(searchData);
        }
        else if($(event.target).is("select[name='searchcountryid']")){
             $("select[name='searchcountryid']").change(function(){
                $("select[name='searchcountryid'] option:selected").each(function(){
                    countryid = $("#searchcountryid").val();
                    searchData = "searchcountryid="+countryid;
                    searchFor(searchData);
                }); 
             });
        }
    });
});

function searchFor(searchData){
    $.ajax({
       type: "POST",
       url: "/s_city_index.php",
       data: searchData,
       success:function(msg){
           $(".indexList").ajaxComplete(function(event,request){
                if(msg.toString() != "searcherror")
                    $(".indexList").html(msg);
                else
                   $(".indexList").html('No matching results.');
           });
       }
   });
}

function getCountrySelection(searchData){
    $.ajax({
       type: "POST",
       url: "/s_coun_sel.php",
       data: searchData,
       success:function(msg){
           $("select[name='searchcountryid']").ajaxComplete(function(event,request){
                if(msg.toString() != "searcherror")
                    $("select[name='searchcountryid']").html(msg);                
                else
                   $("select[name='searchcountryid']").html('No matching results.');            
           });
       }
   });
}

Answer 1

Проблема в том, что вы определяете ajaxComplete внутри обратного вызова. Функция ajaxComplete - это обратный вызов GLOBAL, который запускается после каждого вызова ajax. Попробуйте что-то вроде этого:

function searchFor(searchData){
    $.post("/s_city_index.php", searchData, function(msg){
        if(msg.toString() != "searcherror"){
            $(".indexList").html(msg);
        } else {
            $(".indexList").html('No matching results.');
        }
    });
}

function getCountrySelection(searchData){
    $.post("/s_coun_sel.php", searchData, function(msg){
        if(msg.toString() != "searcherror"){
            $("select[name='searchcountryid']").html(msg);                
        } else {
            $("select[name='searchcountryid']").html('No matching results.');
        }
    });
}