Tuesday 7 January 2014

Gridview with Search and Highlight facility : Asp .Net

Hello, Today i will share code which provide facility for search data in grid view and how to highlight the searched result. Instead of buying the third party controls this code provide easy way to do this. You just need to make some CSS and user defined function call to make it working check out below code.
here we can make CSS class which contain color code to highlight , two user define functions for the search text and for bind high light CSS class. And on onrowcreate we can implement CSS of Onmouseover & Onmouseout for highlight row on which we have cursor. and gridview operation is also covered using sqldatasource.

we just need to set some CSS ans JS call (very simple) and some code behind.

We are call two events of grid view to make this
1. OnRowCreated
2. EditRowStyle-BackColor
3. user define function

How we can done this
1. Create CSS code for the row hover & highlight search result

CSS


 
   
 

2. Code behind : for RowCreated event

protected void gridSample_RowCreated(object sender, GridViewRowEventArgs e)
   {
       if (e.Row.RowType == DataControlRowType.DataRow)
       {
           e.Row.Attributes.Add("onmouseover", "this.className='OnOver'");
           e.Row.Attributes.Add("onmouseout", "this.className='OnOut'");
      }
  }

Two user define function for the high light and set/remove CSS class first function defines how to highlight text by string functions ( not to worry for understand just put it in your code) and second to replaces words.

User Define Function

public string HighlightText(string InputTxt)
{
    string Search_Str = txt_catname.Text;
 
    // Setup the regular expression and add the Or operator.
    Regex RegExp = new Regex(Search_Str.Replace(" ", "|").Trim(), RegexOptions.IgnoreCase);
    // Highlight keywords by calling the
    //delegate each time a keyword is found.
    return RegExp.Replace(InputTxt, new MatchEvaluator(ReplaceKeyWords));
}
 
public string ReplaceKeyWords(Match m)
{
    return ("" + m.Value + "");
} 
Download

click to begin

1.00 MB


FriendlyURL : The extension less Page URL in ASP .NET

Hello Every one, this is my first post on this blog this is all about the URL rewriting in asp .net. there are old traditional way to do this is asp .net but as of now there are NuGet package available which can do this for you automatically.
 you just need to configure little bit things on your web application. Benificial for SEO and User Friendly URL in asp .net application which is till tough task. but now it is easy to do.
If you page URL is
www.yupcode.com/home.aspx
www.yupcode.com/home.aspx?customer=123
 By FriendlyUrls this will be
 www.yupcode.com/home
www.yupcode.com/home/customer/123
Install it via NuGet Package
  OR by

                 Tools > Library Package Manager > Manage Nuget Packages for Solution
 After Installation completed you find following component automatically added in your application
First of all you need to Put Following code in "Global.asax" file so by that it work on Whole application from start up.

Global.asax

<%@ Application Language="C#" %>
<%@ Import Namespace="System.Web.Routing" %>

    void Application_Start(object sender, EventArgs e) 
    {
        RouteConfig.RegisterRoutes(RouteTable.Routes);
    }

Make sure blow code is added in you RouteConfig.cs file

RouteConfig.cs

  public static void RegisterRoutes(RouteCollection routes)
        {
            var settings = new FriendlyUrlSettings();
            settings.AutoRedirectMode = RedirectMode.Permanent;
            routes.EnableFriendlyUrls(settings);
        }

 Run Application and check your address bar

 

You can also pass the query string data from one page to another by simply the following code


C#
  
 protected void Button1_Click(object sender, EventArgs e)
    {
        Response.Redirect(FriendlyUrl.Href("/second","id","123"));
    }
1: "/second" is the page name where you want to redirect
2: "id" & "123" is the query string value which we are passing from one page to another.



Get Query string parameter on second page At page load by Request.GetFriendlyUrlSegments()   whilch is able to get data indidually and in IList<>  Check You below code.
On second.aspx Page insert below code at page load to get data which are passed through the query string and then we can access them in our code

Second.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Routing;
using Microsoft.AspNet.FriendlyUrls; 

public partial class second : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        string paramete1 = Request.GetFriendlyUrlSegments()[0].ToString();

        string parameter2 = Request.GetFriendlyUrlSegments()[1].ToString();
    }
}


To get Query string data in IList<>

C#

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Routing;
using Microsoft.AspNet.FriendlyUrls; 

public partial class second : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        string paramete1 = Request.GetFriendlyUrlSegments()[0].ToString();

        string parameter2 = Request.GetFriendlyUrlSegments()[1].ToString();
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        IList temp = Request.GetFriendlyUrlSegments();
        
        foreach (var data in temp)
        { 
           Response.Write(data.ToString()+"");
        }

    }
}


You can also pass Friendly URL using <a> tag , hyperlink and link button which are mostly used in asp .net

using <a> tag

Remeber to Import Name space in Your .aspx Page like below to use this functionality in markup code

This will let you get rid over the aspx extension at URL which is User Friendly and beneficial for SEO too! , Frankly i can say during when i am newbie , I used to see the extension to check whether the website is developed in asp.net by checking extension ha ha . but using some tools your able to check the extension of page :(.
I find this good feature of ASP.NET. Hope you all enjoy it and also like the post. stay tuned for more stuff.

Dropdown List with Search Facility using Jquery : Asp .Net

Hello,Today i am sharing code which provide the search facility on the Dropdown list control of the asp .net.
We can easily make dropdown with search facility by using Chosen JavaScript. simple but very use full and easy to implement functionality on dropdown list
Instead of <select> </select> of standard HTML tag......  you can use Dropdown list with search facility using JQUER


This is based on JQuery form HARVEST  

Check here demo HERE

I will implement this jquery on dropdown list , make it quit simple to implement and understand 

.chzn-select & .chzn-select-deselect need to cal the make this functionality to work. without it you are not able to get this functionality on Dropdown list. But on standard <select> </select> tag you can get this functionality directly

Put this Code in Head tag


    



   
   

   

Your Dropdown List Is like below 1. you just need to set the css class to add search functionality to your drop-down list

C#


            
            Guajarat 
            Maharastra
            Rajastan
            Hariayana
            Banglore
            Panjab
            Ahmedabad
            Mumbai
            Pune
            Hydrabad
            Bardoli
 

You can also Download Example Below :
Download Example

Click to Start Download

1.00 MB