第三級選擇第一和第二個下拉選擇值更改時，下拉選擇無法更改

我創建了3個選擇表單，其值應基於第一個選擇進行更改。例如，選擇國家和國家在該國家顯示。顯示選擇州和城市。但我在實際中發現的現實是，當我測試這個代碼時，狀態在國家改變時會改變。但是，當州改變時，城市無法填充任何東西。但是，如果我選擇在狀態中設置默認值並首先進行更改，則會生成城市。但是當我從國家開始，然後說明，城市就會失敗。下面是代碼：我沒有看到什麼是錯的。第三級選擇第一和第二個下拉選擇值更改時，下拉選擇無法更改

<script type="text/javascript"> 
$(document).ready(function(){ 

    $("select.country_id").change(function(){ 
     var selectedCountry = $(".country_id option:selected").val(); 
     $.ajax({ 
      type: "POST", 
      url: "location_state_processor.php", 
      data: { country_id : selectedCountry } 
     }).done(function(data){ 
      $("#responsestate").html(data); 
     }); 
    }); 

    $("select.state_id").change(function(){ 
     var selectedState = $(".state_id option:selected").val(); 
     $.ajax({ 
      type: "POST", 
      url: "location_city_processor.php", 
      data: { state_id : selectedState } 
     }).done(function(data){ 
      $("#responsecity").html(data); 
     }); 
    }); 

}); 
</script> 

<div id="responsecountry"> 
<select name="country_id" class="country_id select" title="Select Country"><option value="0">Select Country</option><option value="1">Afghanistan</option><option value="2">Albania</option> 
<option value="3">Algeria</option> 
<option value="4">American Samoa</option> 
<option value="5">Andorra</option><option value="6">Angola</option> 
<option value="7">Anguilla</option> 
<option value="8">Antarctica</option> 
</select></div> 



<div id="responsestate"><select class="state_id select" name="state_id"> 
     <option value="0">--Select State--</option><option value="5303">Barisal</option><option value="1161">Chittagong</option><option value="1162">Dhaka</option><option value="1163">Khulna</option><option value="1164">Rajshahi</option><option value="5304">Sylhet</option></select></div> 




<div id="responsecity"><select class="city_id select" name="city_id"> 
<option value="0">--Select City--</option> 
<option value="19081">Ackley</option> 
<option value="19082">Ackworth</option> 
<option value="18035">Adair</option> 
<option value="19131">Adel</option> 
</select></div>

來源

2017-12-18 Ekene

您是否驗證了您到達那裏的數據？另外，你可以檢查控制檯中是否有錯誤嗎？ – Nisarg

嗨@NisargShah我該怎麼做？是的，沒有控制檯錯誤 – Ekene

你可以在這裏找到一些基本知識：https://developer.mozilla.org/en-US/docs/Mozilla/Debugging/Debugging_JavaScript – Nisarg

試試下面的代碼：

<div id="responsestate"><select class="state_id select" name="state_id" onchange="fetchCities(this)"> 
    <option value="0">--Select State--</option> 
    <option value="5303">Barisal</option> 
    <option value="1161"> 
     Chittagong 
    </option> 
    <option value="1162">Dhaka</option> 
    <option value="1163">Khulna</option> 
    <option value="1164">Rajshahi</option> 
    <option value="5304">Sylhet</option> 
</select></div> 




function fetchCities(ele){ 
    state_id = $(ele).val(); 
    $.ajax({ 
      type: "POST", 
      url: "location_city_processor.php", 
      data: { state_id : selectedState }; 
      success: function(responseData, textStatus, jqXHR) { 
       results = responseData.results; 
       $("#responsecity").html(data); 
      }, 
      error: function(jqXHR, textStatus, errorThrown) { 
       console.log(jqXHR, errorThrown); 
      } 
     }); 

}

來源

2017-12-18 10:37:05

這將起作用，除了在狀態更改無效時生成'onchange =「fetchCities（this）」' – Ekene

你的意思是狀態改變不起作用嗎？以上代碼假設在選擇下拉列表的更改事件上工作。無論如何，它應該工作。 –

我都面臨着類似的問題一次。雖然我使用的是angularjs。問題即將到來，因爲您使用html綁定響應。您最好在您的控制器中編寫此更改函數，並將響應存儲在某個數組中。然後在你的html選項中迭代數組。同樣也會得到城市。

來源

2017-12-18 10:40:37 Naj

第三級選擇第一和第二個下拉選擇值更改時，下拉選擇無法更改

回答

相關問題