navigate to section of a page

2 posts, 1 answers
  1. L
    L avatar
    295 posts
    Member since:
    Apr 2008

    Posted 15 Mar Link to this post

    hi 

    How do i make the navigate url to link to a section of a page? I try using the code below but is not working. Here is what i want to accomplish using RadPanelBar instead of anchor tag http://www.echoecho.com/htmllinks08.htm. Thanks a lot

    <telerik:RadPanelItem runat="server" Text="Customers">
                <Items>
                    <telerik:RadPanelItem runat="server" NavigateUrl="#customer" Text="View Customers">
                    </telerik:RadPanelItem>
                </Items>
    </telerik:RadPanelItem>

     

     <div class="panel panel-primary" style="margin-right:5px;margin-top:2px">
             <div class="panel-heading" id="customer">
                <h3 class="panel-title">Customer</h3>
             </div>
              <div class="panel-body">
                <h4>How to use View Customers</h4>
                  <hr />
                  <p></p>
              </div>
    </div>

  2. Answer
    Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1266 posts

    Posted 18 Mar Link to this post

    Hello,

    In order to navigate to a specific section of the page the NavigateUrl of the panelbar item should point to the id of the h3 element, and not to the id of a div element, as it is in the current case.
    <asp:ScriptManager runat="server" />
           <telerik:RadPanelBar ID="RadPanelBar" runat="server">
               <Items>
                   <telerik:RadPanelItem runat="server" Text="Customers">
                       <Items>
                           <telerik:RadPanelItem runat="server" NavigateUrl="#customer" Text="View Customers">
                           </telerik:RadPanelItem>
                       </Items>
                   </telerik:RadPanelItem>
               </Items>
           </telerik:RadPanelBar>
     
           <div class="panel panel-primary" style="margin-right: 5px; margin-top: 1000px">
               <div class="panel-heading">
                   <h3 class="panel-title" id="customer">Customer</h3>
               </div>
               <div class="panel-body">
                   <h4>How to use View Customers</h4>
                   <hr />
                   <p></p>
               </div>
           </div>


    Regards,
    Dimitar Terziev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top