Filter Data by Values in Model Binding Using Drop Down List in .NET 4.5

Introduction

In this article we will learn how to filter data by values in Model Binding using a Drop Down List.

In my previous article I told you about filtering data using Model Binding but in that article we were not using any type of drop down list, we had to filter data by making changes in the URL section.

Step 1

Add the Drop Down List to your Web Page and add the following properties in its Source Code.

      <asp:DropDownList ID="employee" runat="server" SelectMethod="GetEmployee" DataTextField="Name" AutoPostBack="true" AppendDataBoundItems="true" DataValueField="ID">
             <asp:ListItem Text="all" Value="" />
         </asp:DropDownList>

Step 2

I am also adding the EmptyDataTemplate element to the Grid View so that if no product matches the data the user requested then it can provide a message.

<asp:GridView ID="GridView1" runat="server" SelectMethod="GetEmployee" AutoGenerateColumns="true">
             <EmptyDataTemplate>No Item match to your selection </EmptyDataTemplate>
         </asp:GridView>

Step 3

Now we have to update the GetEmployee method to take a new parameter that contains the ID of the selected Name from the Drop Down List.

public IEnumerable<Employee> GetEmployee([QueryString("q")]string keyword, [Control("Employee")]int? ID)
        {
             IEnumerable<Employee> query = null;
             if (keyword != null)
            {
                 IList<Employee> emplist = new List<Employee>();
                emplist.Add(new Employee { ID = 1, Name = "Jones", Salary = 4000, Designation = "Trainee" });
                emplist.Add(new Employee { ID = 2, Name = "Jimmy", Salary = 4000, Designation = "Trainee" });
                emplist.Add(new Employee { ID = 3, Name = "Jacob", Salary = 12000, Designation = "Developer" });
                emplist.Add(new Employee { ID = 4, Name = "Janet", Salary = 25000, Designation = "HR" });
                emplist.Add(new Employee { ID = 5, Name = "Jamal", Salary = 4000, Designation = "Trainee" });
                query = emplist.Where(p => p.Designation.Contains(keyword));
            }
             if (ID.HasValue && ID.Value > 0)
            {
                query = query.Where(p => p.ID==ID);
            }
             return query;
        }

Step 4

The complete code is as follows:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.ModelBinding;

 

namespace WebApplication5
{
     public partial class WebForm1 : System.Web.UI.Page
    {
         public class Employee
        {
             public int ID { get; set; }
             public string Name { get; set; }
             public int Salary { get; set; }
             public string Designation { get; set; }
        }

        public IEnumerable<Employee> GetEmployee([QueryString("q")]string keyword, [Control("Employee")]int? ID)
        {
             IEnumerable<Employee> query = null;
             if (keyword != null)
            {
                 IList<Employee> emplist = new List<Employee>();
                emplist.Add(new Employee { ID = 1, Name = "Jones", Salary = 4000, Designation = "Trainee" });
                emplist.Add(new Employee { ID = 2, Name = "Jimmy", Salary = 4000, Designation = "Trainee" });
                emplist.Add(new Employee { ID = 3, Name = "Jacob", Salary = 12000, Designation = "Developer" });
                emplist.Add(new Employee { ID = 4, Name = "Janet", Salary = 25000, Designation = "HR" });
                emplist.Add(new Employee { ID = 5, Name = "Jamal", Salary = 4000, Designation = "Trainee" }); 
                query = emplist.Where(p => p.Designation.Contains(keyword));
            }
             if (ID.HasValue && ID.Value > 0)
            {
                query = query.Where(p => p.ID==ID);
            }
             return query;
        }
   }
}

Step 5

There is one more important thing to remember; that is to add the QueryString("q"). You first had to add the Namespace "System.Web.ModelBinding;" otherwise it will give an error in your code.

Step 6

Now on debugging the code you can select the Name from the Drop Down List and the Grid View will show the filtered data because it will be automatically rebounded. This is possible because Model Binding tracks the value of parameters for the SelectMethod and determine whether any parameter value has changed after a post-back. If so, Model Binding will force the associated data control to rebind the data.

In the picture above all the data has been shown, but now I will select one of the Names from the Drop Down List.