Thursday, April 12, 2012

Sorting asp.net Gridview using Jquery

Tablesorter is a Jquery pulgin easy to use. Now you can sort your data without postbacking the page.It gives the client side sorting functionality.
Click to check more on Tablesorter

Code

Default.aspx
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="jqueryTableSort._Default" %>


    
    
    
    


    

Sort gridview using Jquery plugin Table Sorter

Default.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace jqueryTableSort
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack) 
            {
                BindGrid();
                
            }

        }
        #region BIND GRID
        private void BindGrid() 
        {
            CountryDataData objData = new CountryDataData();
            GridView1.DataSource = objData.GetCountryDataList();
            GridView1.DataBind();
            GridView1.UseAccessibleHeader = true;
            GridView1.HeaderRow.TableSection = TableRowSection.TableHeader; 

        }
        #endregion
    }
}
CountryData.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace jqueryTableSort
{
    public class CountryDataData
    {
        public int Id { get; set; }
        public string CountryName { get; set; }
        public List GetCountryDataList()
        {
            return new List
            {
                new CountryDataData{Id=1,CountryName="India"},
                new CountryDataData{Id=2,CountryName="Australia"},
                new CountryDataData{Id=3,CountryName="UK"},
                new CountryDataData{Id=4,CountryName="UAE"},
                new CountryDataData{Id=5,CountryName="Bangladesh"},
                new CountryDataData{Id=6,CountryName="Austria"},
                new CountryDataData{Id=7,CountryName="Japan"},
                new CountryDataData{Id=8,CountryName="China"},
                new CountryDataData{Id=9,CountryName="Dubai"},
                new CountryDataData{Id=10,CountryName="South Africa"},
                new CountryDataData{Id=11,CountryName="Mexcico"},
                new CountryDataData{Id=12,CountryName="Merryland"},
                new CountryDataData{Id=13,CountryName="USA"},
                new CountryDataData{Id=14,CountryName="Peru"},
                new CountryDataData{Id=15,CountryName="Nepal"},
                new CountryDataData{Id=16,CountryName="Pakistan"},
                new CountryDataData{Id=17,CountryName="Srilanka"},
                new CountryDataData{Id=18,CountryName="Vietnam"},
                new CountryDataData{Id=19,CountryName="Westindies"},
                new CountryDataData{Id=20,CountryName="England"},
                new CountryDataData{Id=21,CountryName="Afganistan"},
                new CountryDataData{Id=22,CountryName="Russia"},
                new CountryDataData{Id=23,CountryName="Newzeland"},
                new CountryDataData{Id=24,CountryName="Timore"},
                new CountryDataData{Id=25,CountryName="Canada"}

            };

        }

    }
}



Download Code





No comments:

Post a Comment