2012-10-03 73 views
5

我想保持滚动位置RadPanelBar。我的RadPanelBar被放置在自动刷新的页面中。当我滚动条向下RadPanelBar它在页面刷新上向上。它不应该。我试图用下面的代码处理它,但它不工作。我错过了什么吗?在自动页面刷新RadPanelBar滚动上升

这里是我的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> 

,这是我HTML代码:

<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> 

这里是页的背后我的代码:

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); 

} 

我是初学者,所以我提供适当的帮助。

+0

您是否尝试将maintainScrollPositionOnPostback页指令设置为true?看看它是否有帮助。 – Tariqulazam

回答

2

你与饼干努力,这里也有一段代码试试这个ALOS, 把这个代码在JavaScript部分

这将节省滚动的要求起动位置,它将存储滚动的位置回来时,页面已完全呈现。

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(); 
     } 

,这里是你的HTML

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

我相信这将解决您的问题。谢谢 如果是解决方案,请将其标记为答案。

+0

嗨Azeem Raavi感谢您的解决方案。 – Mubarak