如何使用数据库视图在asp.net mvc中进行级联下拉列表

时间:2017-03-28 12:14:39

标签: javascript jquery ajax asp.net-mvc sql-server-2008-r2

在我的页面中,我有分区下拉菜单,用户从中选择任何分区,并选择此分区,我调用更改事件,在此事件中我编写jquery ajax代码并在url中调用控制器getcustomers方法它从数据库视图查询,但这个ajax方法不起作用,我也在控制台调试器模式下看到它,我想填充客户下拉列表所需的帮助。

注意:我希望仅从此数据库视图中获取客户。

Plz see the image of database view here

<script type="text/javascript">
//Dropdownlist Selectedchange event
        function DivisionChanged(item) {

            //$("#dvn_code").change(function () {$('#dvn_code')
            var select_division = $(item).val();
            $("#customers").empty();

            debugger;
            $.ajax({

                url: '@Url.Action("GetCustomers")',
                type: 'POST',
                @*url: '@Url.Action("GetStates")'*@ // we are calling json method
                dataType: 'json',
                data: { id: $(this).val() },
                success: function (data) {
                    customers.append($('<option/>', { value: -1, text: 'Select customers' }));
                    $(data).each(function (index, item) {
                        customers.append($('<option/>', { value: item.id, text: item }));

                    });

                }

            });
            return false;
        }
        </script>  

/////控制器代码

public JsonResult GetCustomers(int id)
        {
            string cs = ConfigurationManager.ConnectionStrings["DBContext"].ConnectionString;
            List<V_CustomerForDropDown> customers = new List<V_CustomerForDropDown>();
            String query = "SELECT cst_Name FROM PT.V_CustomerForDropDown where dvn_code==id";
            using (SqlConnection con = new SqlConnection(cs))
            {
                SqlCommand cmd = new SqlCommand(query, con);
                //cmd.CommandType = CommandType.TableDirect;
                con.Open();
                SqlDataReader rdr = cmd.ExecuteReader();
                while (rdr.Read())
                {
                    V_CustomerForDropDown c = new V_CustomerForDropDown();
                    c.cst_Name = rdr["cst_Name"].ToString();
                    customers.Add(c);

                }
               // con.Close();
                return this.Json(customers);
            }
        }

更新(现在这是问题): 我以json格式传递数据以从控制器进行查看,它也传递数据但在视图中如何在下拉列表中填充它

// controller

[HttpPost]
        public ActionResult GetCustomers(string id)
        {
            var customers = (from a in db.V_CustomerForDropDown.Where(c => c.dvn_code == id) select new { a.cst_Name, a.cst_Code }).ToList();

            return Json(customers, JsonRequestBehavior.AllowGet);
        }

// index.chtml

<div class="col-md-4">
                                        <select class="form-control selectpicker" id="customers"  multiple title="Multiple Select" data-live-search="true" data-menu-style="dropdown-blue">
                                            </select>

// javascript代码

<script type="text/javascript">

    function DivisionChanged(item) {
             var select_division = $(item).val();

        $.ajax({

            url: '@Url.Action("GetCustomers")',// we are calling json method
            type: 'POST',
            dataType: 'json',
            data: { id: select_division },
            success: function (customers) {
                debugger;
                $.each(customers, function (i, cust) {
                    $("#customers").append('<option value>' + cust.cst_Name +  '</option>');
                });
            }
        });
        return false;
    }
    </script>

1 个答案:

答案 0 :(得分:0)

data: { 'id':  select_division }

[HttpPost]

装饰Action方法
[HttpPost]
public JsonResult GetCustomers(int id)
        {
            string cs = ConfigurationManager.ConnectionStrings["DBContext"].ConnectionString;
            List<V_CustomerForDropDown> customers = new List<V_CustomerForDropDown>();
            String query = "SELECT cst_Name FROM PT.V_CustomerForDropDown where dvn_code==id";
            using (SqlConnection con = new SqlConnection(cs))
            {
                SqlCommand cmd = new SqlCommand(query, con);
                //cmd.CommandType = CommandType.TableDirect;
                con.Open();
                SqlDataReader rdr = cmd.ExecuteReader();
                while (rdr.Read())
                {
                    V_CustomerForDropDown c = new V_CustomerForDropDown();
                    c.cst_Name = rdr["cst_Name"].ToString();
                    customers.Add(c);

                }
               // con.Close();
                return this.Json(customers);
            }
        }

更改您的查询

String query = "SELECT cst_Name FROM PT.V_CustomerForDropDown where dvn_code="+ id;

更改后所有这些都对Action方法进行了调试,并检查它是否会命中,如果是,则调试ajax的成功函数并检查数据是否按照您的指示填写

<强>更新

创建一个扩展方法来处理控制器中的空字符串值。     public static class Extensions     {

    public static string EmptyIfNull(this object value)
    {
        if (value == null)
            return "";
        return value.ToString();
    }
}

用法:

c.cst_Name = rdr["cst_Name"].EmptyIfNull();