级联下拉需要空白值MVC5

-1

希望能够轻松回答。我使用下面的代码生成级联下拉列表，但是，当我选择国家时，州自动填充我的州表中的第一个值（适用于相应的国家/地区）。我认为我需要在某处添加一个空字符串，但我不确定在哪里。级联下拉需要空白值MVC5

感谢

h2>Cascading DropDownList Sample</h2> 



<div> 

    <div> 

     @Html.DropDownList("dropdownCountry", new SelectList(string.Empty, "Value", "Text"), "Please select a country", new { @style = "width:250px;" }) 

    </div> 

    <div style="margin-top:50px;"> 


     @Html.DropDownList("dropdownState", new SelectList(string.Empty, "Value", "Text"), "Please select a state", new { @style = "width:250px;" }) 

    </div> 

</div> 

@section scripts 
{ 

<script> 

    $(function() { 

     $.ajax({ 

      type: "GET", 

      url: "/test/getcountries", 

      datatype: "Json", 

      success: function (data) { 

       $.each(data, function (index, value) { 

        $('#dropdownCountry').append('<option value="' + value.CountryId + '">' + value.CountryName +'</option>'); 

       }); 

      } 

     }); 



     $('#dropdownCountry').change(function() { 



      $('#dropdownState').empty(); 



      $.ajax({ 

       type: "POST", 

       url: "/test/GetStatesByCountryId", 

       datatype: "Json", 

       data: { countryId: $('#dropdownCountry').val() }, 

       success: function (data) { 

        $.each(data, function (index, value) { 

         $('#dropdownState').append('<option value ="' + value.Id + '">' + value.StateName + '</option>'); 

        }); 

       } 

      }); 

     }); 

    }); 

</script> 
    }

来源

2017-06-15 JohnNewbie

建议你参考[这个答案]（https://stackoverflow.com/questions/33247717/how-to-keep-cascade-dropdownlist-selected-items-after-form-submit/33248183#33248183）为正确处理级联下拉列表的方式 –

在您所在的国家/地区下拉更改事件成功回调函数，您必须进行一行更改。

$('#dropdownState').append('<option>Select State</option>'); 
$.each(data, function (index, value) { 
    $('#dropdownState').append('<option value ="' + 
     value.Id + '">' + value.StateName + '</option>'); 
});

而且我建议你把你的选项放在变量中，最后把这个值分配给下拉。

var html = ''; 
html = '<option>Select State</option>'; 
$.each(data, function (index, value) { 
    html += '<option value ="' + 
     value.Id + '">' + value.StateName + '</option>'; 
}); 
$('#dropdownState').html(html)

追加功能添加选项来选择元素，这将导致问题，如果你选择国家A将提供5个州。然后你选择国家乙，其中提供10个州，然后最终结果在国家下拉将是国家B的15个州选项。因此，而不是追加我已经使用HTML功能。

来源

2017-06-15 10:48:03

完美！谢谢 – JohnNewbie

你能标记答案是正确的。 –

你可以只在第一时间由服务GetStatesByCountryId返回的元素添加一个模拟项目。 ID字段可以是空白的，州名可以是“请选择”。然后，您可以检查所选项目ID是否为空。

来源

2017-06-15 10:36:53 ali

级联下拉需要空白值MVC5

回答

相关问题