Sorting In Telerik Radgrid

Sorting In Telerik Radgrid

For Sorting  in Radgrid we have to set Some properties.
1)      AllowSorting="true"
2)      OnSortCommand="RadGrid1_SortCommand"
3)      HeaderButtonType="TextButton"


Step 1: Design web Form .aspx page

<div>
         <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <telerik:RadGrid ID="RadGrid1" runat="server" CellSpacing="0" AllowSorting="true" PageSize="8"  Width="50%" PagerStyle-AlwaysVisible="true" OnSortCommand="RadGrid1_SortCommand"
                GridLines="None" AutoGenerateColumns="false"
                OnNeedDataSource="RadGrid1_NeedDataSource">
                
                <HeaderStyle HorizontalAlign="Left" />
                <MasterTableView DataKeyNames="name" AutoGenerateColumns="false">
                    <NoRecordsTemplate>No records found.</NoRecordsTemplate>

                    <Columns>
                        <telerik:GridBoundColumn HeaderText="Name" DataField="Name"  HeaderButtonType="TextButton"/>
                        <telerik:GridBoundColumn HeaderText="Amount" DataField="Amount" HeaderButtonType="TextButton" />
                        <telerik:GridBoundColumn HeaderText="Phone" DataField="Phone" HeaderButtonType="TextButton"/>
                    </Columns>


                </MasterTableView>
            </telerik:RadGrid>
    </div>


Step 2: Logic on .Cs page

//Radgrid Event for Sorting its coloums
    protected void RadGrid1_SortCommand(object sender, Telerik.Web.UI.GridSortCommandEventArgs e)
    {

    }
    //Binding Radgrid With Data Using DataTable
    protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("Name");
        dt.Columns.Add("Amount");
        dt.Columns.Add("Phone");


        dt.Rows.Add("Kandy", "12", "8802***2564");
        dt.Rows.Add("Sam", "25", "545502*2544");
        dt.Rows.Add("Izhar", "32", "95802*2452");
        dt.Rows.Add("Vineet", "10.2", "88022564***");


        dt.Rows.Add("Kandy", "0.12", "8802***2564");
        dt.Rows.Add("Sam", "12", "545502*2544");
        dt.Rows.Add("Izhar", "215", "95802*2452");
        dt.Rows.Add("Vineet", "11.00", "88022564***");
        dt.Rows.Add("Kandy", "0.12", "8802***2564");
        dt.Rows.Add("Sam", "12", "545502*2544");
        dt.Rows.Add("Izhar", "215", "95802*2452");
        dt.Rows.Add("Vineet", "11.00", "88022564***");
        dt.Rows.Add("Kandy", "0.12", "8802***2564");
        dt.Rows.Add("Sam", "12", "545502*2544");
        dt.Rows.Add("Izhar", "215", "95802*2452");
        dt.Rows.Add("Vineet", "11.00", "88022564***");

        RadGrid1.DataSource = dt;


    }

It Will look like :-



Comments

Popular posts from this blog

Create and save QR code in asp.net with C#

Change text of RadGrid Header Dynamically

Telerik Radwindow Open on Button Click