javascript - jQuery ajax not populating drop down list -
i have been wrecking brain trying around issue. i'm having trouble select dropdown list not being populated results returned based on previous selection.
the relevant html code follow:
<div class="widget property_search"> <form action="https://www.agentsforbidden.co.za/" id="searchproperty" name="searchproperty" method="get"> <div class="search_frm_left clearfix"> <div class="form_row clearfix advt-ptype"> <span class="chkbox"><input type="radio" name="property_type" id="property_type_sale" value="sale" checked= checked><label for="property_type_sale"> sale</label></span> <span class="chkbox"><input type="radio" name="property_type" id="property_type_rent" value="rent"><label for="property_type_rent"> rent</label></span> </div> <div class="form_row"> <label>keyword</label> <input type="text" value="" name="s" id="search_near-1135114534" class="searchpost" placeholder="" /> </div> <div class="form_row clearfix"> <label>province</label> <div class="selectbox"> <select name="adv_zone" id="adv_zone" class="adv_zone"> <option value="">select province</option> <option value="5">eastern cape</option> <option value="3">free state</option> <option value="6">gauteng</option> <option value="2">kwazulu-natal</option> <option value="9">limpopo</option> <option value="7">mpumalanga</option> <option value="10">north west</option> <option value="8">northern cape</option> <option value="11">western cape</option> </select> </div> </div> <div class="form_row clearfix"> <label>city</label> <div class="selectbox"> <select name="adv_city" id="adv_city" class="adv_city"> <option value="">select city</option> </select> </div> </div> the problem when select province city drop down list not getting populated. when inspect post , return values firebug can see getting response required (all options dropdown) doesn't populated.
here's relevant jquery ajax bit:
jquery(".adv_zone").live("change", function () { var e = jquery(this), t = e.parents(".form_front_style").find(".adv_city"), = jquery(this).val(); jquery.ajax({ url: ajaxurl, type: "post", data: "action=fill_city_cmb&state_id=" + i, success: function (e) { if (t.html(e), t.trigger("change"), "" != t.find("option:selected").val()) t.trigger("change"); else { var = t.find("option").first(); t.next("span.select").text(i.text()) } } }) }) and lastly response (truncated due long post):
<option value="">select city</option><option value="5651">akasia</option><option value="5652" >alberton</option><option value="5653">albertynsville</option><option value="5654" >alexandra</option><option value="12694" >alphen park</option><option value="5655">alrapark</option><option value="5656">alrode</option><option value="5657">althea</option> when ajax fired can see following part true , executed:
if (t.html(e), t.trigger("change"), "" != t.find("option:selected").val()) t.trigger("change");
i appreciate insight why not working expected.
Comments
Post a Comment