Saturday 3 August 2013

sorting data of coloum in Gridview with Up and Down Arrow using Asp.Net



Description:-

                        In this Example we Explain that How to Create Sorting of Coloumn data in Gridview. In this Example we Display two arrow image one is up and second is down.when user click on the up arrow then all data in Gridview are automatically sorted in Asceding order and when click on down arrow the all Record are sorting in Descending order.

You can easily create sorting in every coloumn wise. Like we want sort all record in ascending order by it’s name field.

So doing this First you have to click on the name coloumn when you click the arrow is automatically display and you can easily doing ascending and descening record by using up and down arrow key in each coloumn in Gridview.

You have to set SortExpression at Design time like

<Columns>
<asp:BoundField DataField="Id" HeaderText="Id" SortExpression="Id" InsertVisible="False" ReadOnly="True" />
<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Question" HeaderText="Question" SortExpression="Question" />
</Columns>

to show Example of Dynamically create row with Datatable and bind to gridview DataTable Example

to show Example of How to Read and Write File in asp.Net Read and Write File in Asp.Net

to show Example of Nested Gridview click here Nested Gridview in Asp.Net

Default.aspx:-



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="gvpoll" runat="server" CssClass="Gridview"
AllowPaging="True" AllowSorting="True" PageSize="4" HeaderStyle-BackColor="#7779AF"
HeaderStyle-ForeColor="White" AutoGenerateColumns="False" ShowFooter="True"
DataSourceID="polldata" onrowdatabound="gvpoll_RowDataBound" DataKeyNames="Id" CellPadding="4" ForeColor="#333333" GridLines="None">

        <EditRowStyle BackColor="#2461BF" />
        <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

<HeaderStyle BackColor="#507CD1" ForeColor="White" Font-Bold="True"></HeaderStyle>

<PagerSettings  FirstPageText="First" PreviousPageText="Previous" NextPageText="Next"  LastPageText="Last" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
        <AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="Id" HeaderText="Id" SortExpression="Id" InsertVisible="False" ReadOnly="True" />
<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Salary" HeaderText="Salary" SortExpression="Salary" />
</Columns>
        <RowStyle BackColor="#EFF3FB" />
        <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
        <SortedAscendingCellStyle BackColor="#F5F7FB" />
        <SortedAscendingHeaderStyle BackColor="#6D95E1" />
        <SortedDescendingCellStyle BackColor="#E9EBEF" />
        <SortedDescendingHeaderStyle BackColor="#4870BE" />
</asp:GridView>
<asp:SqlDataSource ID="polldata" runat="server" ConnectionString="Data Source=SQLDB;User ID=Demoh;Password=Demo1@"
SelectCommand="SELECT * FROM [poll]" ProviderName="System.Data.SqlClient" >
</asp:SqlDataSource>
    </div>
    </form>
</body>
</html>





Default.aspx.cs:-



using System;

using System.Collections.Generic;

using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Default2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void gvpoll_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        string imgAsc = @" <img src='up.jpeg' border='1' title='Ascending' 'width='50' height='50' />";
        string imgDes = @" <img src='down.jpeg' border='1' title='Descendng' 'width='50' height='50' />";
        if (e.Row.RowType == DataControlRowType.Header)
        {
            foreach (TableCell td in e.Row.Cells)
            {
                LinkButton lnkbtn = (LinkButton)td.Controls[0];
                if (lnkbtn.Text == gvpoll.SortExpression)
                {
                    if (gvpoll.SortDirection == SortDirection.Ascending)
                    {
                        lnkbtn.Text += imgAsc;
                    }
                    else
                        lnkbtn.Text += imgDes;
                }
            }
        }
    }
}
  

1 comments: