設置選擇選項使用jQuery

Question

我有國家，州三個選擇框，市

<select name="property_country" id="country" > 
    <option value="">Country</option> 
</select> 

<select name="property_state" id="state" > 
    <option value="">State</option> 
</select> 

<select name="property_city" id="city"> 
    <option value="">City</option> 
</select> 

PHP被充國，阿賈克斯是填補國家和城市字段，沒有問題存在。我在數據庫中有兩個國家 - 印度和美國。

如果我選擇印度，ajax正確地給出狀態。但是，如果我重新選擇選項標籤「國家」，那麼州和城市字段將變爲空白。如果沒有選擇國家（意思是「國家」），我需要jQuery代碼來填寫上面給出的「州」和「城市」的默認標籤和值。

這可以通過填寫State和City條目並將它們附加到Country然後onload（body或javascript）上載默認值來完成。但是這將使驗證工作也拼湊而不是合乎邏輯的流程。因此需要jQuery解決方案。

我的jQuery代碼如下：

$(document).ready(function() { 
    $('#country').on('change', function() { 
    var country_id = $('#country').val(); 
    $.ajax({ 
     type: 'POST', 
     url: '../controllers/select.php', 
     data: "country_id=" + country_id, 
     success: function(msg) { 
     $("#state").html(msg); 
     } 
    }); 
    }); 

    $('#state').on('change', function() { 
    var state_id = $('#state').val(); 
    $.ajax({ 
     type: 'POST', 
     url: '../controllers/select.php', 
     data: "state_id=" + state_id, 
     success: function(msg) { 

     $("#city").html(msg); 
     } 
    }); 
    }); 

我試圖

if (country_id == "") { 
    $("#state").val("State");    
} else {  
    $.ajax({}); 
} 

Answer 1

您必須再次重新添加空白選項選擇欄，如果國家值復位。

$('#country').on('change', function() { 
var country_id = $('#country').val(); 
if(country_id){ 
    $.ajax({ 
    type: 'POST', 
    url: '../controllers/select.php', 
    data: "country_id=" + country_id, 
    success: function(msg) { 
     $("#state").html(msg); 
    } 
    }); 
    } 
    else{ 
    $("#state").html(' <option value="">State</option>'); 
    $("#city").html(' <option value="">City</option>'); 
    } 
});