Column Display / Persist

[Bill O'Neil]

the most common request we get when it comes to our (rather heavy) use of RadGrid is to allow users to save which columns are visible on the grid (when we allow users to show/hide columns using the contextheader.)

 What would be the best method to do this?  Is RadPersistenceFramework overkill (does it even allow this?)  

Or should we cook up something using custom javascript?  No other settings (page, sort, etc) - just toggling the initial "display" setting for various columns.

Thoughts?

[Konstantin Dikov]

Hi Bill,

As demonstrated in the following online demo, the RadPersistenceManager will store the visibility of the columns when you use the HeaderContextMenu for hiding/showing the columns and after you click on the Save button:

• http://demos.telerik.com/aspnet-ajax/controls/examples/integration/persisting-grid-settings/defaultcs.aspx?product=grid

Although that the demo does not match your exact requirement, you can easily modify it. What you will have to do is to save the state of the grid after you hide or show a column through the HeaderContextMenu. In order to do that you could handle the client-side OnColumnShown and OnColumnHidden events and initiate a postback where you could save the grid state through the RadPersistanceManager. However, this approach will initiate a postback on each column action, so it is not user friendly.

For your convenience, following is a very simple example demonstrating how to achieve the same by handling the Hidden event of the RadContextMenu and initiate a postback through a hidden RadButton:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
        function initiateSaveState(sender, args) {
            $find("<%=DummyButton1.ClientID%>").click();
        }

        function menuShowing(sender, args) {
            args.get_menu().add_hidden(initiateSaveState);
        }
    </script>
</telerik:RadCodeBlock>

<telerik:RadPersistenceManager runat="server" ID="RadPersistenceManager1">
    <PersistenceSettings>
        <telerik:PersistenceSetting ControlID="RadGrid1" />
    </PersistenceSettings>
</telerik:RadPersistenceManager>

<telerik:RadGrid ID="RadGrid1" runat="server" OnNeedDataSource="RadGrid1_NeedDataSource" EnableHeaderContextMenu="true">
    <ClientSettings>
        <ClientEvents OnHeaderMenuShowing="menuShowing" />
    </ClientSettings>
</telerik:RadGrid>

<telerik:RadButton runat="server" ID="DummyButton1" Style="visibility: hidden;" OnClick="DummyButton1_Click"></telerik:RadButton>

And the code-behind:

protected void Page_Init(object sender, EventArgs e)
{
    RadPersistenceManager1.StorageProvider = new SessionStorageProvider();
}

protected void Page_PreRender(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        if (Session["test"] != null)
        {
            SessionStorageProvider.StorageProviderKey = "test";
            RadPersistenceManager1.LoadState();
        }
    }
}

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
{
    DataTable table = new DataTable();
    int columnsCount = 20;
    int rowsCount = 30;
    for (int i = 0; i < columnsCount; i++)
    {
        table.Columns.Add("Column" + i, typeof(string));
    }

    for (int i = 0; i < rowsCount; i++)
    {
        table.Rows.Add();
        for (int z = 0; z < columnsCount; z++)
        {
            table.Rows[i][z] = "SomeValue" + i;
        }
    }

    (sender as RadGrid).DataSource = table;
}

protected void DummyButton1_Click(object sender, EventArgs e)
{
    SessionStorageProvider.StorageProviderKey = "test";
    RadPersistenceManager1.SaveState();
}

public class SessionStorageProvider : IStateStorageProvider
{
    private System.Web.SessionState.HttpSessionState session = HttpContext.Current.Session;
    static string storageKey;

    public static string StorageProviderKey
    {
        set { storageKey = value; }
    }

    public void SaveStateToStorage(string key, string serializedState)
    {
        session[storageKey] = serializedState;
    }

    public string LoadStateFromStorage(string key)
    {
        return session[storageKey].ToString();
    }
}

Hope this helps.


Regards,
Konstantin Dikov
Telerik

[Bill O'Neil]

thank you for your time.

will this method store ALL RadGrid settings (so if the grid is on page 2 and sorted those will be saved w/ the column visibility?)

[Konstantin Dikov]

Hi Bill,

The approach from my example will store all settings in the control. If you need to remove some of the settings (or all of them) and include only particular one you could take a look at the following help article:

• http://docs.telerik.com/devtools/aspnet-ajax/controls/persistenceframework/functionality/store-custom-settings

Best Regards,
Konstantin Dikov
Telerik