grind in multipage SaveScrollPosition is not working when i clicked another tab

3 posts, 0 answers
  1. Hyoung woo Lee
    Hyoung woo Lee avatar
    8 posts
    Member since:
    Dec 2009

    Posted 19 Jan 2010 Link to this post


    Hi. I put one grid on multipage . And I set  SaveScrollPosition  property to true to save scroll position. But If i clicked another tab and click the tab contains grid. Grid's Scroll position goes back to top position even if i scrolled down to bottom of vertical scroll bar. 
    Please Let me know if i got wrong direction to use radtab strip. I am totally novice using asp.net ajax controls. 
    My aspx code is below : 
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server">  
        <title></title>  
          <style type="text/css">  
            .pageView  
            {  
                border: 1px solid #898c95;  
                margin-top: -1px;  
                height: 381px;  
            }  
            
        </style> 
     
        <script type="text/javascript">  
          
          function pageLoad() {  
          }  
          
        </script> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <div> 
              <script type="text/javascript">  
     
                  function onTabSelecting(sender, args) {  
                      if (args.get_tab().get_pageViewID()) {  
                          args.get_tab().set_postBack(false);  
                      }  
                  }  
                  
            </script> 
     
            <telerik:RadScriptManager ID="ScriptManager" runat="server" /> 
            <telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1">  
            </telerik:RadAjaxLoadingPanel> 
             <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1" UpdatePanelRenderMode="Inline">  
                <AjaxSettings> 
                    <telerik:AjaxSetting AjaxControlID="RadTabStrip1">  
                        <UpdatedControls> 
                            <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" /> 
                            <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" UpdatePanelRenderMode="Inline" /> 
                        </UpdatedControls> 
                    </telerik:AjaxSetting> 
                    <telerik:AjaxSetting AjaxControlID="RadMultiPage1"  > 
                        <UpdatedControls> 
                            <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" UpdatePanelRenderMode="Inline" /> 
                        </UpdatedControls> 
                    </telerik:AjaxSetting> 
                </AjaxSettings> 
            </telerik:RadAjaxManager> 
            <table> 
                <tr> 
                    <td> 
                         
                         <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"  OnClientTabSelecting="onTabSelecting" 
                            SelectedIndex="0" > 
                            <Tabs> 
                                <telerik:RadTab runat="server" Text="user">                             
                                </telerik:RadTab> 
                                <telerik:RadTab runat="server" Text="group" Selected="True">                           
                                </telerik:RadTab> 
                            </Tabs> 
                        </telerik:RadTabStrip>        
                            <telerik:RadMultiPage ID="RadMultiPage1" CssClass="pageView"   
                                runat="server" SelectedIndex="0"   
                             onpageviewcreated="RadMultiPage1_PageViewCreated1" oninit="RadMultiPage1_Init"   
                                > 
                             <telerik:RadPageView ID="RadPageView1"  Width="400" Height="400" runat="server">  
                                 <telerik:RadGrid ID="RadGrid1"   onprerender="RadGrid1_PreRender"  Width="400px" AllowSorting="True" AllowMultiRowSelection="True" AllowPaging="false"  GridLines="None" 
     runat="server">  
                                     <MasterTableView> 
                                         <RowIndicatorColumn> 
                                             <HeaderStyle Width="20px" /> 
                                         </RowIndicatorColumn> 
                                         <ExpandCollapseColumn> 
                                             <HeaderStyle Width="20px" /> 
                                         </ExpandCollapseColumn> 
                                     </MasterTableView> 
                                     <ClientSettings> 
                                        <Scrolling AllowScroll="True" ScrollHeight="400" UseStaticHeaders="True" SaveScrollPosition="True">  
                                        </Scrolling> 
                                        <Selecting AllowRowSelect="true" /> 
                                    </ClientSettings> 
     
                                 </telerik:RadGrid> 
                             </telerik:RadPageView> 
                              <telerik:RadPageView ID="RadPageView2"  Width="400" Height="400" runat="server">  
                                  <ul> 
                                    <li> 
                                    <label>Name:</label> John Smith</li> 
                                          
                                    </ul> 
     
                             </telerik:RadPageView> 
                         </telerik:RadMultiPage> 
                          
                    </td> 
                    <td> 
                        form Area   
                       </td> 
                </tr> 
            </table> 
        </div> 
                         
        </form> 
    </body> 
    </html> 
     
     
    PS : In Addition , pageviewcreated event never fire though i put onpageviewcreated="RadMultiPage1_PageViewCreated1" on code 
           in RadMultiPage

    Regards,
    Eum
  2. Tomasz M.Lipiński
    Tomasz M.Lipiński avatar
    71 posts
    Member since:
    Nov 2009

    Posted 20 Jan 2010 Link to this post

    Hi,

    I've just encountered the same problem :-)
    SaveScrollPosition deals with postbacks (as it is stated in the documentation) - therefore it doesn't work when switching tabs.
    I've found some workaround:
    <telerik:RadGrid ...  
      <ClientSettings> 
        <ClientEvents OnRowSelected="EXJS.Grid.rowSelectedHandler" OnScroll="onScroll" /> 
      </ClientSettings> 
    var topScroll;  
    function onScroll(sender, eventArgs)   
    {  
      topScroll = eventArgs.get_scrollTop();  
    <telerik:RadTabStrip ... OnClientTabSelected="onTabSelected"
    function onTabSelected(sender, Args)   
    {  
      var scrollArea = document.getElementById("gridMain_GridData");  
      scrollArea.scrollTop = topScroll;  
    In other words: catch scrolling and restore it when switch tabs.

    And what is the official Telerik's solution?

    Regards
    Tomasz
  3. Yana
    Admin
    Yana avatar
    5043 posts

    Posted 25 Jan 2010 Link to this post

    Hello,

    Please use this workaround until we research this issue deeper.

    Kind regards,
    Yana
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Back to Top