如何使用mvc 4中的下拉选项过滤网格？ [英] how to filter web grid by using dropdown selection in mvc 4?

问题描述

如何使用mvc 4中的下拉选项过滤网格？



型号：

how to filter web grid by using dropdown selection in mvc 4?

Model:

public string EmployeeID { get; set;}
       public string EmployeeName { get; set;}
       //public int EmpID { get; set; }
       public SelectList MobileList { get; set; }
       public List<SelectListItem> Department_List { get; set; }
       public IEnumerable<SelectListItem> test;

       public string EName { get; set; }
       public static List<Employee> GetList()
       {
           List<Employee> Employees = new List<Employee>{
         new Employee   { EmployeeID="001", EmployeeName="Kumar"},
         new Employee   { EmployeeID="002", EmployeeName="Mathews"},
         new Employee   { EmployeeID="003", EmployeeName="sundar"},
         new Employee   { EmployeeID="004", EmployeeName="Allen"}
         };
           return Employees;
       }

浏览：



@model IEnumerable< mvcapplication4.models.employee>

@ {

布局= null;

}

@ {var grid = new WebGrid（来源：型号，

defaultSort：EmployeeID，

rowsPerPage：2）;

}

员工详细信息

View:

@model IEnumerable<mvcapplication4.models.employee>
@{
Layout = null;
}
@{ var grid = new WebGrid(source: Model,
defaultSort: "EmployeeID",
rowsPerPage: 2);
}

Employee Details

@ grid.GetHtml（

tableStyle：grid，

headerStyle：head，

列：grid.Columns（

grid.Column（EmployeeID），

grid.Column（EmployeeName）

）





）



@ *

@grid.GetHtml(
tableStyle: "grid",
headerStyle: "head",
columns: grid.Columns(
grid.Column("EmployeeID"),
grid.Column("EmployeeName")
)


)

@*

EmployeeID：@ Html.DisplayFor（ model => model.EmployeeID）

EmployeeID: @Html.DisplayFor(model => model.EmployeeID)

员工姓名：@ Html.EditorFor（model => model.EmployeeName）

EmployeeName: @Html.EditorFor(model => model.EmployeeName)

* @



@using（Html.BeginForm（））

{

@ Html.DropDownList（ list，ViewBag.VBMobileList as SelectList）

}



< input type =submitvalue =search/>

*@

@using (Html.BeginForm())
{
@Html.DropDownList("list", ViewBag.VBMobileList as SelectList)
}

<input type="submit" value="search" />

控制器：

Controller:

public ActionResult show(string search)
       {
           //Employee _model = new Employee();
           var emp = Employee.GetList();

           ////_model.Department_List = (from d in emp
           ////                          select new SelectListItem
           ////                          {
           ////                              Value = d.EmployeeID.ToString(),
           ////                              Text = d.EmployeeName
           ////                          }).ToList();

           //ViewBag.VBMobileList = new SelectList(emp, "EmployeeID", "EmployeeName");
           return View(emp);
           //return View("show", _model);
       }

推荐答案

对您的代码进行了一些更改。请参阅，
给你的下拉列表中的id，

Made some changes to your code. See,
Gave id to your dropdown,

@Html.DropDownList("list", ViewBag.VBMobileList as SelectList, new{ id = "ddl"})

使用id，我得到所选文本并调用Show方法

Using id, I'm getting the selected text and calling the Show method

（ #ddl）。change（ function （）{
window 。 location = ../ Employee / Show？search = +

("#ddl").change(function() { window.location = "../Employee/Show?search=" +

（ #ddl option：selected）。text（）;
}）;

("#ddl option:selected").text(); });

在这里，我实际上使用的是搜索参数

And here, I'm actually using the search parameter

public ActionResult Show(string search)
{
    if(search == null || search == string.empty || string.IsEmptyOrNull(search)) {
        var emp = Employee.GetList();
        return View(emp);
    }
    else{
        var emp = Employee.GetList().Where(e => e.Name == search);
        return View(emp);
    }
}

您可以根据需要更改此代码。 :)

注意：这将刷新页面，所以我建议你研究一下jQuery AJAX。



-KR

You can change this code according to your need. :)
Note: This will refresh the page, so I suggest you to look into jQuery AJAX.

-KR

这篇关于如何使用mvc 4中的下拉选项过滤网格？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！