MVC 级联下拉列表使用存储过程填充下拉列表答案

【问题标题】：MVC Cascading Dropdownlist using Stored Procedures to populate DropdownlistMVC 级联下拉列表使用存储过程填充下拉列表
【发布时间】：2023-03-19 21:55:01
【问题描述】：

所以我有两个下拉列表，第二个下拉列表取决于第一个下拉列表，因此需要级联样式。我通过存储过程填充了第一个下拉列表，但我不确定如何将第一个下拉列表的 ID 值传递给存储过程以填充第二个下拉列表。我已经设置了第二个下拉列表的存储过程，但不确定如何在控制器中调用它，并将第一个下拉列表的 SelectedValue 作为参数传入。这是我的代码：

控制器：

public ActionResult CreateForm(){
        List<SelectListItem> CountyList = new List<SelectListItem>();
        List<SelectListItem> DistrictList = new List<SelectListItem>();

        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["Conn"].ToString()))
        {
            con.Open();
            using (SqlCommand cmd = new SqlCommand("dbo.USP_SELECT_COUNTY", con))
            {
                cmd.CommandType = System.Data.CommandType.StoredProcedure;
                SqlDataReader rdr = cmd.ExecuteReader();
                while (rdr.Read())
                {
                    CountyList.Add(new SelectListItem
                    {
                        Value = rdr[0].ToString(),
                        Text = rdr[1].ToString()
                    });

                }
            }
        }
        ViewBag.CountyList = new SelectList(CountyList.ToList(), "Value", "Text");

        return View();
    }

    public ActionResult TogetDistrictList(string CountyList)
    {
        List<SelectListItem> DistrictList = new List<SelectListItem>();
        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["Conn"].ToString()))
        {
            con.Open();
            SqlParameter[] parameters = { new SqlParameter("@IDN_COUNTY", CountyList) };
            SqlCommand cmd = CreateCommand("dbo.USP_SELECT_DISTRICT", parameters, con);
            //using (SqlCommand cmd = new SqlCommand("dbo.USP_SELECT_DISTRICT", con))
            {

                cmd.CommandType = System.Data.CommandType.StoredProcedure;
                SqlDataReader rdr = cmd.ExecuteReader();
                while (rdr.Read())
                {
                    DistrictList.Add(new SelectListItem
                    {
                        Value = rdr[0].ToString(),
                        Text = rdr[1].ToString()
                    });

                }
            }
        }
        ViewBag.DistrictList = new SelectList(DistrictList.ToList(), "Value", "Text");


        //DistrictList.Add(new SelectListItem { Text = "DistrictList1" + CountyList, Value = "DistrictList1" + CountyList });

        return Json(CountyList.ToList(), JsonRequestBehavior.AllowGet);
    }


    public SqlCommand CreateCommand(string procedurename, SqlParameter[] parameters, SqlConnection connection)
    {
        SqlCommand cmd = new SqlCommand(procedurename, connection);
        cmd.CommandType = CommandType.StoredProcedure;
        foreach (SqlParameter param in parameters)
        {
            if (param.Value == null)
                param.Value = DBNull.Value;
            cmd.Parameters.Add(param);
        }
        return cmd;
    }

}

查看：

<script type="text/javascript">
jQuery(function($){
  $('#ddlCounty').change(function () {$.ajax('@Url.Action("TogetDistrictList")',  JSON.stringify({CountyList: $("#ddlCounty").val()}) ).done(function(data){                        

                     $('#ddlDistrict').empty();
                     $.each(data,function(i,value){                      
                         $('#ddlDistrict').append($('<option/>').val(value.Value).text(value.Text))
                     })
                 });
                 });
});
</script>

@Html.DropDownList("ddlCounty", ViewBag.CountyList as SelectList})

@Html.DropDownList("ddlDistrict", Enumerable.Empty<SelectListItem>())

使用上面的代码，我在调试时得到一个 NullReferenceException，我认为这是因为选择的下拉值被作为 NULL 传递给存储过程，但我不确定如何解决它，因为我尝试放入一个实际的ID 值，但仍然得到相同的错误。

【问题讨论】：

这是一个糟糕的代码，原因有很多。参考this DotNetFiddle 了解如何编写级联下拉列表
欣赏小提琴，这是我第一次从存储过程填充级联下拉列表，因此代码到处都是。我会看看如何清理我的代码。

标签： jquery asp.net-mvc ado.net cascadingdropdown

【解决方案1】：

我通过将 Json.stringify 更改为 data: ({CountyList: $('#ddlCountyList').val()}), datatype: json,

这在将父下拉选择值传递给控制器操作时起作用，控制器操作反过来填充第二个下拉列表。

【讨论】：

答案在答案部分，而不是在问题中。我已经回滚了你的编辑。编辑此内容以包含您的答案。
答案包括在内。

【解决方案2】：

函数GetDistrictList() {

        $.ajax({
            url: '@Url.Action("TogetDistrictList", "getDistrict")',
            type: "POST",
            data: { CountyList: $('#countryId').val() },
            success: function(datas, textStatus, jqXHR) {
                if (datas != null) {
                    row = "";
                    row += "<option value='0'>--Select District---</option>";
                    $.each(datas,
                        function(i, v) {
                            row += "<option value='" + v.Value + "'>" + v.Text + "</option>";
                        })
                    $('#ddlDistrict').html(row);
                }
            },
            error: function(ex) {

            }
        });
    }

【讨论】：