
Projects By LANGUAGE
Libraries
Articles & seminars
Source Code

The price of the projects include source code, abstract, report and support for development and deployment. Please use our contact us form or send email to Support@srishtis.com
ASP.NET Search records in GridView footer and highlight results using Ajax |
||
In this example we are populating gridview without using sqlDataSource but by creating Sqlconnection and SqlCommand.We've put a textbox for text to search in footer of gridview using footer template,and the search results are highlighted using regular expression,we are using AJAX for partial postback and update progress template to show search progress |
||
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Search and highlight Results in Gridview </title> <style type="text/css"> .highlight {text-decoration:none; font-weight:bold; color:black; background:yellow;} </style> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <div> <asp:GridView ID="grdSearch" runat="server" BackColor="white" BorderColor="Aqua" AutoGenerateColumns="false" ShowFooter="true" OnRowCommand="grdSearch_RowCommand"> <FooterStyle BackColor="AliceBlue" ForeColor="AntiqueWhite" /> <PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" /> <HeaderStyle BackColor="#003399" Font-Bold="True" ForeColor="#CCCCFF" /> <Columns> <asp:TemplateField HeaderText="FirstName"> <ItemTemplate> <asp:Label ID="lblFIrstName" runat="server" Text='<%# Highlight(Eval("FirstName").ToString()) %>'> </asp:Label> </ItemTemplate> <FooterTemplate> <asp:TextBox ID="txtSearch" runat="server" Width="70px"></asp:TextBox> <asp:Button ID="btnSearch" CommandName="Search" runat="server" Text="Search" Width="60px" /> </FooterTemplate> </asp:TemplateField> <asp:BoundField DataField="LastName" HeaderText="LastName" /> </Columns> </asp:GridView> </div> </ContentTemplate> </asp:UpdatePanel> <asp:UpdateProgress ID="UpdateProgress1" runat="server"> <ProgressTemplate> <br /> <img src="Images/ajax.gif" alt="Searchig" /> </ProgressTemplate> </asp:UpdateProgress> </form> </body> </html> |
||
|
||
using System; using System.Data; using System.Configuration; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using System.Text.RegularExpressions; using System.Data.SqlClient; public partial class _Default : System.Web.UI.Page { string strConnection = ConfigurationManager.AppSettings["ConnectionString"]; protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { BindGrid(); } } private DataTable GetRecords() { SqlConnection conn = new SqlConnection(strConnection); conn.Open(); SqlCommand cmd = new SqlCommand(); cmd.Connection = conn; cmd.CommandType = CommandType.Text; cmd.CommandText = "Select * from Employees"; SqlDataAdapter dAdapter = new SqlDataAdapter(); dAdapter.SelectCommand = cmd; DataSet objDs = new DataSet(); dAdapter.Fill(objDs); return objDs.Tables[0]; } private void BindGrid() { DataTable dt = GetRecords(); if (dt.Rows.Count > 0) { grdSearch.DataSource = dt; grdSearch.DataBind(); } } |
||
Now we've written a method to search the text within results of GridView, which user enter in the TextBox to search |
||
private void SearchText(string strSearchText) { DataTable dt = GetRecords(); DataView dv = new DataView(dt); string SearchExpression = null; if (!String.IsNullOrEmpty(strSearchText)) { SearchExpression = string.Format("{0} '%{1}%'", grdSearch.SortExpression, strSearchText); } dv.RowFilter = "FirstName like" + SearchExpression; grdSearch.DataSource = dv; grdSearch.DataBind(); } |
||
Next step is to check the command in RowCommand event of grid view,if it is what u've defined in while creating the button in footer of grid by assigning the commandname property, if yes than get the text entered by user in textbox placed in footer of gridview by using findcontrol method and pass this text to the search method written earlier by making a call to that method |
||
protected void grdSearch_RowCommand (object sender, GridViewCommandEventArgs e) { System.Threading.Thread.Sleep(2000); if (e.CommandName == "Search") { TextBox txtGrid = (TextBox)grdSearch.FooterRow.FindControl("txtSearch"); SearchText(txtGrid.Text); } } |
||
Now to highlight the search text in results i m using regexp and replacing the the words found with highlighted in yellow color |
||
public string Highlight(string InputTxt) { GridViewRow gvr = grdSearch.FooterRow; if (gvr != null) { TextBox txtExample = (TextBox)grdSearch.FooterRow.FindControl("txtSearch"); if (txtExample.Text != null) { string strSearch = txtExample.Text; Regex RegExp = new Regex(strSearch.Replace(" ", "|").Trim(), RegexOptions.IgnoreCase); return RegExp.Replace(InputTxt, new MatchEvaluator(ReplaceKeyWords)); RegExp = null; } else return InputTxt; } else { return InputTxt; } } public string ReplaceKeyWords(Match m) { return "<span class=highlight>" + m.Value + "</span>"; } |
