Grid - Persisting Grid Settings

Drag a column header and drop it here to group by that column
CustomerIDCompanyNameContactNameContactTitleCity
     
Page size:
 91 items in 10 pages
ALFKIAlfreds FutterkisteMaria AndersSales RepresentativeBerlin
ANATRAna Trujillo Emparedados y heladosAna TrujilloOwnerMéxico D.F.
ANTONAntonio Moreno TaqueríaAntonio MorenoOwnerMéxico D.F.
AROUTAround the HornThomas HardySales RepresentativeLondon
BERGSBerglunds snabbköpChristina BerglundOrder AdministratorLuleå
BLAUSBlauer See DelikatessenHanna MoosSales RepresentativeMannheim
BLONPBlondesddsl père et filsFrédérique CiteauxMarketing ManagerStrasbourg
BOLIDBólido Comidas preparadasMartín SommerOwnerMadrid
BONAPBon app'Laurence LebihanOwnerMarseille
BOTTMBottom-Dollar MarketsElizabeth LincolnAccounting ManagerTsawassen
  • NoFilter
  • Contains
  • DoesNotContain
  • StartsWith
  • EndsWith
  • EqualTo
  • NotEqualTo
  • GreaterThan
  • LessThan
  • GreaterThanOrEqualTo
  • LessThanOrEqualTo
  • Between
  • NotBetween
  • IsEmpty
  • NotIsEmpty
  • IsNull
  • NotIsNull
  • Custom
  • Sort Ascending
  • Sort Descending
  • Clear Sorting
  • Group By
  • Ungroup
  • Columns

Demo Configurator

Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This example demonstrates saving and restoring RadGrid settings by user.

Using the Persistence Framework, you can save/restore grid settings like:

  • Page size
  • Group-by expressions
  • Sort expressions
  • Filter expression
  • Column settings
    • Width
    • OrderIndex
    • Display
    • Visible
    • CurrentFilterFunction
    • CurrentFilterValue
For a complete list of the supported settings, please go to the following article:

To simulate a different user, make a selection from the "User" combo box.
For each user, the settings can be saved and restored using the buttons located below the combo.

Instuctions

Make changes to the grid by applying filter/group-by/sort expressions. Reorder and resize columns, or show/hide columns using the header context menu. Then, save the settings and choose a different user from the combo. Make additional changes and save these as well. Finally, you can choose a user from the combo box and restore the settings associated with this user.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page Language="c#" Inherits="Telerik.GridExamplesCSharp.Integration.PersistingGridSettings.DefaultCS"CodeFile="DefaultCS.aspx.cs"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadFormDecorator RenderMode="Lightweight" ID="RadFormDecorator1" runat="server" ControlsToSkip="Scrollbars, Zone"></telerik:RadFormDecorator>
    <telerik:RadPersistenceManager ID="RadPersistenceManager1" runat="server">
        <PersistenceSettings>
            <telerik:PersistenceSetting ControlID="RadGrid1" />
        </PersistenceSettings>
    </telerik:RadPersistenceManager>
    <telerik:RadAjaxManager ID="RadAjaxManager" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="ConfiguratorPanel1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="ConfiguratorPanel1" LoadingPanelID="LoadingPanel1" />
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="LoadingPanel1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadGrid1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="LoadingPanel1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadGrid RenderMode="Lightweight" runat="server" ID="RadGrid1" GridLines="None" ShowFooter="True"
        DataSourceID="SqlDataSource1" AllowFilteringByColumn="True" AllowSorting="True"
        ShowGroupPanel="True" AllowPaging="true" PageSize="10">
        <MasterTableView AutoGenerateColumns="False" DataKeyNames="CustomerID" DataSourceID="SqlDataSource1"
            EnableHeaderContextMenu="true">
            <Columns>
                <telerik:GridBoundColumn DataField="CustomerID" DefaultInsertValue="" HeaderText="CustomerID"
                    ReadOnly="True" SortExpression="CustomerID" UniqueName="CustomerID">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="CompanyName" DefaultInsertValue="" HeaderText="CompanyName"
                    SortExpression="CompanyName" UniqueName="CompanyName">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="ContactName" DefaultInsertValue="" HeaderText="ContactName"
                    SortExpression="ContactName" UniqueName="ContactName">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="ContactTitle" DefaultInsertValue="" HeaderText="ContactTitle"
                    SortExpression="ContactTitle" UniqueName="ContactTitle">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="City" DefaultInsertValue="" HeaderText="City"
                    SortExpression="City" UniqueName="City">
                </telerik:GridBoundColumn>
            </Columns>
        </MasterTableView>
        <ClientSettings AllowDragToGroup="True" AllowColumnsReorder="True">
            <Resizing AllowColumnResize="true"></Resizing>
        </ClientSettings>
    </telerik:RadGrid>
    <telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1">
    </telerik:RadAjaxLoadingPanel>
    <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        ProviderName="System.Data.SqlClient" SelectCommand="SELECT [CustomerID], [CompanyName], [ContactName], [ContactTitle], [Address], [City] FROM [Customers]"
        runat="server"></asp:SqlDataSource>
    <qsf:ConfiguratorPanel ID="ConfiguratorPanel1" runat="server">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" >
                    <ul class="fb-group">
                        <li>
                            <qsf:ComboBox runat="server" ID="UserSelection" AutoPostBack="true" Size="Wide">
                                <Items>
                                    <telerik:RadComboBoxItem Text="User1" Value="User1" Selected="true"></telerik:RadComboBoxItem>
                                    <telerik:RadComboBoxItem Text="User2" Value="User2"></telerik:RadComboBoxItem>
                                    <telerik:RadComboBoxItem Text="User3" Value="User3"></telerik:RadComboBoxItem>
                                </Items>
                            </qsf:ComboBox>
                        </li>
                        <li>
                            <qsf:Button runat="server" ID="Button1" Text="Save" OnClick="Button1_Click" Size="Narrow">
                            </qsf:Button>
                            <qsf:Button runat="server" ID="Button2" Text="Load" OnClick="Button2_Click" Size="Narrow">
                            </qsf:Button>
                            <qsf:Button runat="server" ID="Button3" Text="Clear" OnClick="Button3_Click" Size="Narrow">
                            </qsf:Button>
                        </li>
                    </ul>
                    <div style="float: right;">
                        <asp:Image runat="server" ID="InfoImage" Visible="false" EnableViewState="false"
                            Style="float: left;" ImageUrl="~/Controls/Examples/Integration/Persisting-Grid-Settings/images/info_icon.png"></asp:Image>
                        <asp:Label runat="server" ID="StatusLabel" EnableViewState="false" Style="float: left; font-style: italic; padding: 5px 0 0 5px;">
                        </asp:Label>
                    </div>

                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?