On auto page refresh RadPanelBar scroll goes up

Question

I want to maintain scroll position of RadPanelBar. My RadPanelBar is placed in a page which is on auto refresh. When I scroll the bar downward of RadPanelBar it goes upward on page refresh. It should not. I am trying to handle it with following code but its not working. Am I missing something?

Here is my JavaScript

<script type="text/javascript">
function SetScrollPositionOnlineContacts() {

    //var pane = splitter.GetPaneById("RadPanelBarRoster");
    //document.getElementById("RadPanelBarRoster").scrollTop;

    var splitter =$find("RadSplitterBottomParent");
    var intY =  splitter.GetPaneById("RadPanelBarRoster").scrollTop;

    var date = new Date();
    date.setTime(date.getTime() + (1 * 60 * 60 * 1000));
    var expires = "; expires=" + date.toGMTString();
    document.cookie = "cookieDivOnlineContacts" 
                      + "=" 
                      + intY 
                      + expires + "; path=/";
    //document.title = intY;
}

function readCookieOnlineContacts(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
    }
    return null;
}
    </script>

and this is my HTML code :

<telerik:RadSplitter ID="RadSplitterBottomParent" runat="server" Height="100%" 
    Width="100%" Orientation="Vertical" BackColor="#ECECFF" Skin="WebBlue" 
    LiveResize="True" SplitBarsSize="" HeightOffset="124" Visible="true" 
    BorderSize="0" PanesBorderSize="0">

    <!-- Start Left Roster Panel -->
    <telerik:RadPane ID="RadPaneRoster" runat="server" Width="220px" 
        Scrolling="None">
        <telerik:RadContextMenu ID="RadContextMenuRoster" runat="server" 
            OnClientItemClicked="onRosterContextMenuClick" 
            EnableShadows="True">
            <Items>
                <telerik:RadMenuItem runat="server" Text="View 
                    Conversation">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="View Properties">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Add to Favourites" 
                    Enabled="False">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadContextMenu>
        <telerik:RadPanelBar ID="RadPanelBarRoster" runat="server" 
            Skin="Metro" 
            Width="100%" onscroll="SetScrollPositionOnlineContacts()"
            Height="3000px" OnClientItemClicked="onRosterClick" 
            OnClientContextMenu="onRosterContextMenu"
            PersistStateInCookie="True" Style="width: 100%; border-top: 0; 
            border-bottom: 0;
            z-index: 2" ExpandMode="FullExpandedItem" EnableViewState="True" 
            ViewStateMode="Inherit"
            OnItemClick="RadPanelBarRoster_ItemClick">
        </telerik:RadPanelBar>
    </telerik:RadPane>
</telerik:RadSplitter>

here is my code behind page :

protected void Page_Load(object sender, EventArgs e)
{

    if (!IsPostBack)
    {
        StringBuilder sbScript = new StringBuilder();
        sbScript.Append(
            "<script language='JavaScript' type='text/javascript'>");
        //For order Panel
        sbScript.Append(
        "document.cookie = cookieDivOnlineContacts + \"" + 
        "=\" + \"\" + -1 + \"; path=/\";");

        sbScript.Append("</script>");
        //// Make use ScriptManager to register the script
        ScriptManager.RegisterStartupScript(
            this, 
            this.GetType(), 
            "@@@@MyCallBackAlertScript", 
            sbScript.ToString(), 
            false);
    }

    StringBuilder sbScript1 = new StringBuilder();
    sbScript1.Append(
        "<script language='JavaScript' type='text/javascript'>");
    //For order Panel
    sbScript1.Append(
        "var strCookOnlineContacts = " + 
        "readCookieRfqOrder(\"cookieDivOnlineContacts\"); " + 
        "document.getElementById(\"RadPanelBarRoster\").scrollTop " + 
        "= strCookOnlineContacts;");

    sbScript1.Append("</script>");

    // Make use ScriptManager to register the script
    ScriptManager.RegisterStartupScript(
        this, 
        this.GetType(), 
        "@@@@MyCallBackAlertScript", 
        sbScript1.ToString(), 
        false);

}

I am beginner, so provide me proper help.

Answer 1

you're trying with cookies, here is also a piece of code try this alos, put this code in JavaScript section

this will save scroll position on request start and it will store position of scroll back when page is fully rendered.

 function pageLoad()
        {
            $("your radID").scroll(function() {
            SaveScrollPosition();
            });
        }

    var yPos;
        function SaveScrollPosition(){
         yPos = $("your rad bar id").scrollTop(); 
        }

        function ReturnPos() {
        $("your radID").scrollTop(yPos);
        }


  function OnResponseEnd(sender ,eventArgs)
        {
            ReturnPos();
        }

  function OnRequestStart(sender ,eventArgs)
        {

            SaveScrollPosition();
        }

and here is your html

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest" ClientEvents-OnRequestStart="OnRequestStart" ClientEvents-OnResponseEnd="OnResponseEnd">
// you code here
</telerik:RadAjaxManager>

I am sure this will resolve your problem. Thanks Please mark it as answer if it is a solution.