This AJAX control enables the user to filter data within any column inside a
GridView. The user can add multiple filters and can delete existing ones too.
Source Code and Video
I have uploaded the source code and a Flash video on how to use the control inside your web application, on my blog. To run the video, you have to have the Flash plug-in in your browser. Drag and drop the SWF file inside your browser and it will run: http://tawatech.blogspot.com/2008/06/aspnet-datagridview-ajax-data-filter.html.
I was looking for an ASP.NET 2.0 custom control that enables the user to filter data in a
GridView control by adding filters to the
GridView. Similar controls can be found in applications such as Microsoft BI Studio. So I decided to develop a web based control that will do such thing.
Using the Code
To use the control is very straightforward:
- Add web.config AJAX tags to enable AJAX in your website:
- Drag and drop the filter control in your page. (Note: the control already has the AJAX
ScriptManager, you don't have to create a new
UpdatePanel for the control.)
- Drag and drop an
UpdatePanel for the
- Place the
GridView inside the AJAX
UpdatePanel and specify the
SQLDataSource for it.
Note: The control already has a
ScriptManager, so you don't have to create one in your ASPX page.
Page_Load, specify the
DataColumns for the filter control and specify the event handler method that will be called after adding or removing the filter.
- Calling the control method
FilterDataSource() in the event handler
tableFilter_OnRefresh() will apply the filter on the
SqlDataSource1 that you have assigned to the