QueryExtender Web Control : ASP.NET 4.0

Query extender is a new control introduced in ASP.NET 4.0, this control is used to filter and sort data by using different expressions, it has Search Expression, OrderByExpression, RangeExpressions etc.

When you have data in your Datasource and you want to filter at the application end so you always go for this control.

As of now this control is used with LINQDataSource other DataSource controls are not support with Query Extender in Visual Studio 2010 ASP.NET 4.0 beta 1.

I am building a example how we can filter data using QueryExtender, as it is part of ASP.NET 4.0 here I am using Visual Studio 2010 beta 1 so lets start.

Create a web application and Name it as QueryExtender, now we will add a LINQ To SQL Class file to our project by right clicking the project in Solution Explorer selecting Data and Select LINQ to SQL Class file and name it as LINQProducts.dbml, this is the LINQ DataSource for LINQDataSource.

Once you add this file to our project you can see LINQProducts.dbml file and you will observer 2 parts in the file, now you need to drag and drop your table from Server explorer to right side part, here I am selecting Northwind database's Products table and dropping.

To effect the changes we need to build our project here once.

Now we have created LINQ source for LINQDataSource control, Now open the design view of Default.aspx page and Add LINQDataSource Control from the Toolbox.

Once you have added the LINQDataSource control select the control and click on '>' symbol and click on Configure DataSource, now you will see a wizard for configuring the datasource, select the 'Show only DataContext objects' check box and choose the LINQProductsDataContext from Context combo box, click on next.

Now choose required fields to display, here I am selecting ProductId, ProductName, UnitPrice, UnitsInStock fields to display and click finish.

Now we have creaetd LINQDataSource object and bind the data with Products table to display, now drag and drop GridView control from tool box and add to Default.aspx, and '>' and click on Configure DataSource and select LINQDataSouce1 as datasource and Save.

To check whether data is getting display or not just run the project and see the output .

By this point we have displayed the data using LINQDataSource control to filter the data displayed we will use QueryExtender control, before creating the QueryExtender we need to add a reference in Web.Config to make use of its Expressions, so please add following in Pages -> Control section in Web.Config

Note : In above line you need to replace the PublicKeyToken value with other controls PublicKeyToken.
Once you have done this we are now ready to add QueryExtender to our project just add following code in our Default.aspx page, before adding we need to add some control to our form for search purpose, so add one label and textbox and a button to Default.aspx as shown in the screen shot Design.jpg

Now add QueryExtender control to Default.aspx

In the above lines I am creating a QueryExtender and assigning its taget control as our LINQDataSource1, for filtering I am getting the value from a text box, you can also get the result in order by using OrderByExpression.

Now we are ready with our code so let build, run and test

Hope this helps.