Gridview filtering with EasyQuery ASP.NET (WebForms)

A very common use-case for ASP.NET WebForms application: you have a webpage with a GridView control populated from a database.

Now let’s imagine you want to have a form or some web-control that users can use to filter the results presented in the GridView. Moreover, it would be great to give them a possibility to define several filter conditions and a quick way to turn each condition on/off and see what happens with result dataset instantly.

This is the point where EasyQuery’s QueryPanel web-control comes to help. Take a look at the following GridView filtering form example:

Here is a step-by-step description how to implement this functionality in your own project:

0. Download and install EasyQuery

(of course, only if you didn't do it before)

1. Add QueryPanel control to your .aspx file

We suppose that you have a GridView component connected with some DataSource control. All you need to add - is a QueryPanel control (preferably before the GridView):

<keqwc:querypanel id="QueryPanel1" runat="server" scrollbars="Auto">
</keqwc:querypanel>
 
 . . . . . . . 
 
<asp:gridview id="ResultGrid" runat="server" datasourceid="ResultDS" cellpadding="4" cellspacing="2" gridlines="Vertical">
</asp:gridview>

2. Add EasyQuery initialization code

We need to create DbQuery and DbModel component and assign Query object to QueryPanel control.

private DbQuery query = null;
private DataView resultView;
  
//Here is a function which loads data from the database.
//For demonstration purposes, we show a content of one table here
//but it may be a more complicated query of course.
protected void RefreshResultView(string tableName, string filterExpr) {
  ResultDS.SelectCommand = "Select * From " + tableName;
  ResultDS.FilterExpression = filterExpr;
  resultView = (DataView)ResultDS.Select(DataSourceSelectArguments.Empty);
}
 
//This function fills DbModel object by information from DataTable
protected void LoadModelData(DbModel model, string tableName) {
  RefreshResultView(tableName, "");
  DataTable tbl = resultView.ToTable();
  model.FillByDataTable(tbl, false);
}
  
private void InitQuery() {
  //we store our query in the Session storage
  query = (DbQuery)Session["EQ-GRIDFILTER-DEMO-QUERY"];
 
  //if there is no current query - we create a new one
  if (query == null) {
  DbModel model = new DbModel();
  model.UseResourcesForOperators = true;
  model.AddDefaultOperators();
 
  LoadModelData(model, "Customers");
 
  query = new DbQuery();
  query.Model = model;
  query.Formats.SetDefaultFormats(FormatType.MsAccess);
  Session["EQ-GRIDFILTER-DEMO-QUERY"] = query;
  }
}
 
//Now modify our Page_Load handler to do all initialization procedures
protected void Page_Load(object sender, EventArgs e) {
  //initialize Query and DataModel objects first 
  InitQuery();
  
  //assign Query object to QueryPanel
  QueryPanel1.Query = query;
 
  //add a handler for ConditionsChanged event - to modify our filter according to user's changes in QueryPanel
  query.ConditionsChanged += new Korzh.EasyQuery.ConditionsChangedEventHandler(query_ConditionsChanged);
 
  . . . . . . . . 
}

3. Update filter on every query change

Finally we need to build new filter expression on every user's modification in QueryPanel control and update our result accordingly

//ConditionsChange event handler. All we do here - call a function which updates our result set
protected void query_ConditionsChanged(object sender, Korzh.EasyQuery.ConditionsChangeEventArgs e) {
  UpdateResultset();
}
 
 
protected void UpdateResultset() {
  FilterExpressionBuilder builder = new FilterExpressionBuilder(query);
  builder.BuildFilter();
  string filterExpr = builder.Result.FilterExpr;
  RefreshResultView("Customers", filterExpr);
}

Additional benefits

You can wrap these components into a new UserConrol and use the same approach for filtering in other web pages (.aspx), of your web-application, so that the look and feel, layout and behavior remains unified across the whole web-site.