mvc控制两个下拉列表来过滤数据

时间:2014-07-13 16:16:33

标签: asp.net-mvc drop-down-menu selecteditem selectedindex

大家好我想问一下mvc dropdownlist中的一个问题。我试图将数据过滤到他们的位置或他们的代码,同时下拉选择索引更改。当我使用一个下拉列表时,我可以这样做但是当我使用多个下拉列表时,我无法单独获得结果。

如图所示,我有两个下拉列表。

mvc two dropdownlist selected index

public ActionResult Index(int? id,int? ddwList)
    {

        Repository<Order> _ro = new Repository<Order>();
        IEnumerable<SelectListItem> _orderSelectListItem = _ro.All().AsEnumerable().Select(s => new SelectListItem
        {
            Text = s.code,
            Value = s.id.ToString()
        });

        ViewData["ddOrder"] = _orderSelectListItem;

        Repository<Workshop> _rw = new Repository<Workshop>();
        IEnumerable<SelectListItem> _workshopSelectListItem = _rw.All().AsEnumerable().Select(s => new SelectListItem
        {
            Text = s.name,
            Value = s.id.ToString()
        });

        ViewData["ddwList"] = _workshopSelectListItem;

        Repository<ClothShipment> _rcs = new Repository<ClothShipment>();
        IEnumerable<MyClothShipment> _myClothShipment = null;

        if (id != null)
        {
            int? idOrd = _rcs.Find(w => w.orderId == id).orderId;
            //int? idWork = _rcs.Find(w => w.workshopId == id).workshopId;

            if (idOrd != null)
            {
                _myClothShipment = _rcs.All().Where(w => w.orderId == id).Select(s => new MyClothShipment
               {
                   id = s.id,
                   amount = s.amount,
                   orderName = s.order.code,
                   clothName = s.clothList.name,
                   workshopName = s.workshop.name,
                   shipDate = s.shipDate
               });
            }
            //else if(idWork != null){
            //    _myClothShipment = _rcs.All().Where(w => w.workshopId == id).Select(s => new MyClothShipment
            //    {
            //        id = s.id,
            //        amount = s.amount,
            //        orderName = s.order.code,
            //        clothName = s.clothList.name,
            //        workshopName = s.workshop.name,
            //        shipDate = s.shipDate
            //    });
            //}
        }
        else {
            _myClothShipment = _rcs.All().Select(s => new MyClothShipment
            {
                id = s.id,
                amount = s.amount,
                orderName = s.order.code,
                clothName = s.clothList.name,
                workshopName = s.workshop.name,
                shipDate = s.shipDate
            });
        }

        return View(_myClothShipment);
    }

我的观点在这里

 <div id="sample_editable_2_length" class="dataTables_length">
                        <label>
                            @Html.DropDownList("ddwList",(IEnumerable<SelectListItem>)ViewData["ddwList"],"Atölye Seçiniz",new {@id="StateDropDown1", @class = "span15 chosen"})
                        </label>
                    </div>

我的观点在这里

<div id="sample_editable_2_length" class="dataTables_length">
                        <label>
                            @Html.DropDownList("ddwList",(IEnumerable<SelectListItem>)ViewData["ddwList"],"Atölye Seçiniz",new {@id="StateDropDown1", @class = "span15 chosen"})
                        </label>
                    </div>

<div id="sample_editable_1_length" class="dataTables_length">
                        <label>
                            @*<select class="m-wrap small" name="sample_editable_1_length" size="1" aria-controls="sample_editable_1">

                            </select>*@
                            @Html.DropDownList("ddOrder",(IEnumerable<SelectListItem>)ViewData["ddOrder"],"Sipariş Kodu Seçiniz",new {@id="StateDropDown", @class = "span15 chosen"})
                        </label>
                    </div>

这是我的脚本代码

$("#StateDropDown").change(function (e) {

            var controllerName = '@ViewContext.RouteData.Values["Controller"].ToString()';
            var actionName = '@ViewContext.RouteData.Values["Action"].ToString()';

            var _id = $("#StateDropDown").val();
            var _url = "/" + controllerName + "/" + actionName + "/" + _id;


            window.location.href =_url 

        });

        $("#StateDropDown1").change(function (e) {

            var controllerName = '@ViewContext.RouteData.Values["Controller"].ToString()';
            var actionName = '@ViewContext.RouteData.Values["Action"].ToString()';

            var _id = $("#StateDropDown1").val();
            var _url = "/" + controllerName + "/" + actionName + "/" + _id;


            window.location.href = _url

        });

我在从数据库加载页面时填充下拉列表并获取所有数据以显示下拉列表我想过滤所显示的数据...并且使用此代码我的下拉列表之一工作我正在选择的ID item(Index(int?id))在这里,但当我尝试分别使用它们时,它不起作用,我怎么能让它们都工作。我该怎么办 ?第二个参数总是为null或者如果我使用不同的参数,除了“id”,它再次变为空?而且我也尝试将参数作为字符串,但它也是空的...感谢您的帮助。

2 个答案:

答案 0 :(得分:2)

解释您的代码正在做什么:

当您从第一个选择中选择一个值时,您将其值传递给Index方法(例如/Index/1),因此参数id的值为1但没有将值传递给参数ddwList所以它是null。当您从第二个选择中选择一个值时,您将其值传递给索引方法(编辑/Index/5),因此参数id的值为5,但没有值传递给参数{{1}所以它再次为空。

假设您要根据两个选择的选择显示表格,那么您需要将网址构建为ddwList。因此,从您的选择中删除更改事件,并添加一个按钮,在其单击事件中构造查询。但是,您这样做的方式是每次重新加载整个页面。我建议您考虑使用/Index?id=1&ddwList=5方法从局部视图加载表,以避免每次都加载完整的页面。例如

jQuery.get()

索引视图

public ActionResult Index()
{
  // Build the 2 select lists only
  return View();
}

和脚本

// Add the two @Html.DropdownFor()...
<button id="LoadTable">Load Table</button>
<div id="TablePlaceholder"></div>

和部分结果

$('#LoadTable').click(function() {
  var id1 = // the value of the first select
  var id2 = // the value of your second select    
  $.get('@Url.Action("Table")', { id: id1, ddwList: id2 }, function(data) {
    $('#TablePlaceHolder').html(data);
  });
}

答案 1 :(得分:0)

如果我理解了这一点,你可以一次使用其中一个下拉菜单,下拉菜单成功将它的值发送给你的控制器,而另一个下拉菜单总是发送空值。如果是这种情况,那么您使用选项标签创建下拉列表的方式就可以正常工作。

如msdn文档中所述:http://msdn.microsoft.com/en-us/library/dd492256(v=vs.118).aspx

  

optionLabel 类型:System.String默认空项的文本。   此参数可以为null。

因此,如果您希望两个下拉列表同时可用,则需要删除.change的事件,并添加一个带有这些下拉列表的表单和一个提交按钮,以便在同一时间。

OR

不要使用选项标签,这意味着dropDownList的第一个选项将用作初始/默认值。以下是msdn文档的链接,显示了格式化Html.DropDownList助手的不同方法:http://msdn.microsoft.com/en-us/library/system.web.mvc.html.selectextensions.dropdownlist(v=vs.118).aspx

我希望我理解正确!