locked
Custom scroll bar issue in Update panel RRS feed

  • Question

  • User-431888895 posted

    I have placed a div inside the Update panel for this div am adding jquery Custom scroll bar (size & color has been changing irrespective of the browsers). on page load it is working fine but when post back happens this scroll bar style is changing to default browser style.

    After googleing i found a solution inside the update panel i placed Sys.Application.add_load(myFunctionName);

    My problem is:

    Inside the update panel i placed a button , on button click (onClick) event, a treeview control will be visible and OnSelectedNodeChange of treeview control Child nodes will be expanded, if the child's are more scroll bar is displayed, instead of showing 1 scroll bar it is showing multiple scroll bars (in this case 2 scroll bars because of i called two events (OnClick & OnSelectedNodeChange events))

    MyCode :

    <asp:UpdatePanel id="updatePanel1" runat="server">
    <ContentTemplate>
         <script type="text/javascript">
                        Sys.Application.add_load(CustomScrollBar);
         </script>

    <div class="scrollBar" height="300px">

    <asp:Button ID="btnShowTreeView" runat="server" Text="Show Tree View"  onclick="btnShowTreeView_Click" />

    <asp:TreeView ID="tvList" runat="server" OnSelectedNodeChanged="tvList_SelectedNodeChanged" Visible="false" ShowExpandCollapse="false">        
            <LeafNodeStyle  Font-Size="10px"/>                                                                                              
            </asp:TreeView>
    </div>

    </ContentTemplate>
        </asp:UpdatePanel>

    In button click even am make tree view to visible="true" and here am binding the tree view from backend .cs file

    Thanks in advance...

    Friday, May 30, 2014 12:11 AM

Answers

  • User-417640953 posted

    Hi CodeNet,

    Thank you post the issue to asp.net forum.

    According to your description and code provided, I see you want to apply the css style to div class="scrollBar" d when UpdatePanel do a

    partial postback by click Button. For this issue, I suggest you use the Sys.WebForms.PageRequestManager endRequest Event like below.

      <script type="text/javascript" language="javascript">
                  
                    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
                    function EndRequestHandler(sender, args)
                    {
                       if (args.get_error() != undefined)
                       {
                          
                             CustomScrollBar();
                       }
                    }
    
    
         
      </script>

    http://msdn.microsoft.com/en-us/library/vstudio/bb383810(v=vs.100).aspx

    Hope that helps, thanks.

    Best Regards!

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, June 3, 2014 12:38 AM