Click here to Skip to main content
Click here to Skip to main content

Filterable Grid for ASP.NET

, 12 Aug 2004 GPL3
Rate this:
Please Sign up or sign in to vote.
An article on a filterable Grid for ASP.NET.

Sample Image

Introduction

This article presents an ASP.NET DataGrid with ability to filter based on column values.

Details

I tried to keep the code simple. This code uses JavaScript method filtergrid to build QueryString for the URL. The datasource is filtered based on QueryString values.

 // this method sets the filter condition.
function filtergrid(columnname)
{
  var val;
  var baseurl;
  
  // I have set the baseurl of the demo page here.
  // You can simply replace it with your .aspx page name
  // or may be read programmatically
  // to make this control generic.
  baseurl = 'FilterGridPage.aspx';
  val = document.getElementById('txt' + columnname).value;
  
  self.location.href = baseurl + '?selectedcolumn=' 
                   + columnname + '&selectedvalue=' + val;
}

In the code-behind file, the FillDataGridColumns method creates the column headers with HTML textbox and button.

   '// header cell code
   headerhtml = DisplayNames(i)
   
   '// create html text
   headerhtml = headerhtml & " <br> " & " & _
   "<Input type=text class=FilterTextBox id=txt" & ColumnNames(i) & " /> " & _
   "<Input class=ButtonStyle type=button id=btn" & ColumnNames(i) & _
   " onclick=""javascript:filtergrid('" & ColumnNames(i) & "');"" value='Go'/>"
   
   '// simply set the html text as HeaderText property of BoundColumn
   <BoundColumnVariable>.HeaderText = headerhtml

Scope of further development

  • At present, this control handles String and Double datatypes only. It can be modified to handle other datatypes.
  • Filter works on single value only and can not search for multiple values.

All your suggestions and comments are welcome.

Conclusion

The use of basic JavaScript and code-behind file helps to enhance the functionality of the DataGrid control.

License

This article, along with any associated source code and files, is licensed under The GNU General Public License (GPLv3)

Share

About the Author

Hemang Shukla
Founder Absolute Agile
Australia Australia
Hemang Shukla is Founder of Absolute Agile. Absolute Agile is a Melbourne based Agile training and consulting firm. http://www.absoluteagile.com.au
 
Hemang's blogs are also available at http://www.hemangshukla.blogspot.com/

Comments and Discussions

 
Generalthe baseurl Pinmemberzxd991513-Oct-08 18:01 
GeneralA More Generic method Pinmemberchuck the coder12-Apr-05 2:35 
GeneralRe: A More Generic method Pinmemberkvc23-Apr-05 10:57 
GeneralRe: A More Generic method Pinmemberchuck the coder26-Apr-05 5:47 
GeneralEfficient filter !!!!! PinmemberSukim21-Aug-04 8:59 
GeneralRemove filter PinmemberSébastien Lorion18-Aug-04 13:49 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.141223.1 | Last Updated 13 Aug 2004
Article Copyright 2004 by Hemang Shukla
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid