根据下拉列表中的选定值搜索数据

时间:2014-04-21 09:55:38

标签: asp.net-mvc razor-2

如何根据从下拉列表中选择的值在网格视图中搜索数据 在asp.net MVC架构?请参阅以下代码:

 List<SelectListItem> monthlist = new List<SelectListItem>();
         monthlist.Add(new SelectListItem { Text = "Select Month", Value = "0" });
         monthlist.Add(new SelectListItem { Text = "1", Value = "1" });
         monthlist.Add(new SelectListItem { Text = "2", Value = "2" });
         monthlist.Add(new SelectListItem { Text = "3", Value = "3" });
         monthlist.Add(new SelectListItem { Text = "4", Value = "4" });
         monthlist.Add(new SelectListItem { Text = "5", Value = "5" });
         monthlist.Add(new SelectListItem { Text = "6", Value = "6" });
         monthlist.Add(new SelectListItem { Text = "7", Value = "7" });
         monthlist.Add(new SelectListItem { Text = "8", Value = "8" });
         monthlist.Add(new SelectListItem { Text = "9", Value = "9" });
         monthlist.Add(new SelectListItem { Text = "10", Value = "10" });
         monthlist.Add(new SelectListItem { Text = "11", Value = "11" });
         monthlist.Add(new SelectListItem { Text = "12", Value = "12" });
         ViewBag.month = monthlist;

         List<SelectListItem> yearlist = new List<SelectListItem>();
         yearlist.Add(new SelectListItem { Text = "Select Year", Value = "0" });
         yearlist.Add(new SelectListItem { Text = "2010", Value = "1" });
         yearlist.Add(new SelectListItem { Text = "2011", Value = "2" });
         yearlist.Add(new SelectListItem { Text = "2012", Value = "3" });
         yearlist.Add(new SelectListItem { Text = "2013", Value = "4" });
         yearlist.Add(new SelectListItem { Text = "2014", Value = "5" });
         yearlist.Add(new SelectListItem { Text = "2015", Value = "6" });
         yearlist.Add(new SelectListItem { Text = "2016", Value = "7" });
         yearlist.Add(new SelectListItem { Text = "2017", Value = "8" });
         yearlist.Add(new SelectListItem { Text = "2018", Value = "9" });
         yearlist.Add(new SelectListItem { Text = "2019", Value = "10" });
         yearlist.Add(new SelectListItem { Text = "2020", Value = "11" });

1 个答案:

答案 0 :(得分:0)

不确定是否要根据下拉列表框中选择的值将数据加载到网格中,或者您想过滤网格中的项目。

对于案例1,一种方法是:

一个。创建控制器获取操作和相应的视图。控制器操作将返回视图,它将呈现两个带有提交按钮的组合框。用户将在每个组合框中选择值,然后按“提交”按钮。

在下面的示例中,我传递了一个组织列表,并要求用户选择一个。根据选择,我将显示所选组织的数据。

public class SelectOrganizationViewModel
{
    public int OrganizationId { get; set; }

    public IEnumerable<SelectListItem> Organizations { get; set; }
}

    public ActionResult SelectOrganizationForDataAccess()
    {
        var model = new SelectOrganizationViewModel();
        var list = this.organizationService.GetAllOrganizations();

            model.Organizations =
                list.Select(
                    o =>
                    new SelectListItem
                        {
                            Value = o.OrganizationId.ToString(CultureInfo.InvariantCulture),
                            Text = o.Name
                        });


        return View(model);
    }

湾定义POST操作并接收值。这些值将是所选项目的ID。在下面的示例中,我接受模型OrganizationId属性中的选定值。

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult SelectOrganizationForDataAccess(SelectOrganizationViewModel selectOrganizationViewModel)
    {
        return this.RedirectToAction("LoadGrid", new { organizationId = selectOrganizationViewModel.OrganizationId });
    }

℃。定义一个接收选定月份和年份值的Get方法。根据选定的值读取要在网格中显示的数据,并将其返回到显示网格数据的视图。

    [HttpGet]
    public ActionResult LoadGrid(string selectedMonth, string selectedYear)
    {
       // Load data to be displayed in grid
       var model = new GridViewModel();
       return View(model);
    }

对于案例2,我使用过Kendo Grid,它在过滤方面非常有效。在您的情况下,您仍然需要提交选定的值(您也可以发送Ajax请求)并加载过滤后的数据。