c# - @html.dropdownlist 未填充所选值

Question

这里我有两个下拉列表。第一个显示国家列表，第二个显示所选国家的州值。值列表已正确填充，但在下拉列表中，未填充值。
jQuery：

 $(document).ready(function () {
        $("#Country").change(function () {
            var Id = $('#Country option:selected').attr('value');
            $("#Region").empty();
            $.getJSON("/ControllerName/GetRegionList",{ ID: Id  },
                function (data) {                    
                    jQuery.each(data, function (key) {
                        $("#Region").append($("<option></option>").val(ID).html(Name));
                    });
                });
        });
    });

看法 ：

 @Html.DropDownList("Country", new SelectList(Model.CountryList, "Value", "Text", Model.CountryList.SelectedValue))
 @Html.DropDownList("Region", new SelectList(Model.RegionList, "Value", "Text", Model.RegionList.SelectedValue))

控制器：

      public List<Region> GetRegionList(int ID)
        {
            int countryid = ID;           
            AddressModel objmodel = new AddressModel();
            List<Region> objRegionList = new List<Region>();
            objRegionList.Add(new Region { ID = "0", Name = " " });
            if (countryid != 0)
            {
                countryid = Convert.ToInt32(ID);
                SqlCommand cmd = new SqlCommand("USP_ProcedureName", con);
                cmd.CommandType = CommandType.StoredProcedure;
                cmd.Parameters.AddWithValue("@Id", countryid);
                cmd.Parameters.AddWithValue("@Mode", "Region");
                con.Open();
                SqlDataReader dr = cmd.ExecuteReader();
                while (dr.Read())
                {
                    if (dr["RegionId"].ToString() != "")
                    {
                        objRegionList.Add(new Region { ID = dr["RegionId"].ToString(), Name = dr["Name"].ToString() });
                    }
                }
                dr.Close();
                con.Close();
            }
            return objRegionList;
        }

我的代码中有什么错误。？有什么建议么。编辑：添加快照

Answer 1

在 ASP.NET MVC 控制器操作必须返回 ActionResults。在您的情况下，您可以返回 JSON：

public ActionResult GetRegionList(int id)
{
    var objRegionList = new List<Region>();
    objRegionList.Add(new Region { ID = "0", Name = " " });
    if (countryid != 0)
    {
        int countryid = ID;
        using (var conn = new SqlConnection("YOUR CONNECTION STRING COMES HERE"))
        using (var cmd = conn.CreateCommand())
        {
            con.Open();

            cmd.CommandText = "USP_ProcedureName";
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@Id", countryid);
            cmd.Parameters.AddWithValue("@Mode", "Region");
            using (var dr = cmd.ExecuteReader())
            {
                while (dr.Read())
                {
                    if (dr["RegionId"].ToString() != "")
                    {
                        objRegionList.Add(new Region 
                        { 
                            ID = dr["RegionId"].ToString(), 
                            Name = dr["Name"].ToString() 
                        });
                    }
                }
            }
        }
    }

    return Json(objRegionList, JsonRequestBehavior.AllowGet);
}

请注意，我还从未使用的变量和不必要的Convert.ToInt32调用中清除了您的代码，最重要的是在语句中包装了 IDisaposable 资源，例如 SQL 连接、命令和数据读取器，using以避免资源泄漏。

然后将控制器操作的 url 作为data-*属性包含在第一个下拉列表中，以避免在 javascript 中对其进行丑陋的硬编码，并在将应用程序部署到 IIS 中的虚拟目录时中断：

@Html.DropDownList(
    "Country", 
    new SelectList(Model.CountryList, "Value", "Text", Model.CountryList.SelectedValue),
    new { data_url = Url.Action("GetRegionList", "ControllerName") }
)

最后调整（简化）你的javascript：

$('#Country').change(function () {
    var regionDdl = $('#Region');
    regionDdl.empty();
    var id = $(this).val();
    var url = $(this).data(url);
    $.getJSON(url, { id: id }, function (data) {                    
        $.each(data, function (index, region) {
            regionDdl.append(
                $('<option/>', {
                    value: region.ID,
                    html: region.Name
                })
            );
        });
    });
});