Q3 2009 PanelBar First-Level Templates broken

6 posts, 0 answers
  1. Allow Backorder
    Allow Backorder avatar
    2 posts
    Member since:
    Nov 2009

    Posted 07 Dec 2009 Link to this post

    Hey everyone,

    We tend to have this dilemma with most upgrades from each quarter, but the RadPanelBar First-Level template does not seem to be working correctly after upgrading to Q3 2009.  We position:relative a div up and overlay the contents across the PanelBar header with negative positioning.  While the actual positioning looks correct, the header is rendered un-clickable.

    The code that is in the first level template control:
    <div> 
      <div class="goToTopDiv"
        <runat="server"></a> 
        <href="#top" id="goToTop" class="goToTop"
          <asp:Literal ID="ltlGoToTopText" runat="server"  
                    Text='Go To Top'
          </asp:Literal> 
        </a> 
      </div> 
    </div> 

    The CSS classes:
    .RadPanelBar .goToTopDiv 
        position:relative
        margin-top:-32px
        margin-left:950px
        width:60px
     
    .RadPanelBar .goToTop 
        font-size:.88em; 
        text-decoration:none
        color:Black;  
        z-index:2; 

    Thanks for the help,
    Adam.g

  2. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 10 Dec 2009 Link to this post

    Hi,

     

    Add this CSS to your page to fix this behavior:

    div.RadPanelBar .rpTemplate,
    div.RadPanelBar .rpTemplate div
    {
        float: right;
    }

    Let me know if you still have problems with it.

    Sincerely yours,
    Kamen Bundev
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Adam
    Adam avatar
    70 posts
    Member since:
    Jun 2008

    Posted 11 Dec 2009 Link to this post


    Actually, your above fix affected the markup of the content in the actual section templates.  Adding the float:right to one of the control divs gave most of the needed functionality:

    <div>  
      <div class="goToTopDiv" style="float:right;">  
        <runat="server"></a>  
        <href="#top" id="goToTop" class="goToTop">  
          <asp:Literal ID="ltlGoToTopText" runat="server"   
                    Text='Go To Top'>  
          </asp:Literal>  
        </a>  
      </div>  
    </div>  

    However, when setting the name property of the first anchor tag, no other links can use them as an anchor target (ie link url = #linktarget).
  5. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 17 Dec 2009 Link to this post

    Hello Adam,

    I'm not sure I understand what are you trying to achieve in your code snippet. Can you send me a live URL and elaborate a little bit on the needed functionality? I'll convert the forum post to a support ticket if you need the privacy.

    All the best,
    Kamen Bundev
    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.
  6. Adam
    Adam avatar
    70 posts
    Member since:
    Jun 2008

    Posted 14 Jan 2010 Link to this post

    It's pretty simple really.  For pages with multiple panel bar sections, we provide links at the top of the page that allow the user to jump to a particular section.  In order to ensure the user still sees the actual section they jumped to, we put this anchor in the first-level template as opposed to somewhere in the actual content of the section.  We also have a go to top link in the first-level template that allows the user to jump back to the top of the page.  With the solutions offered so far in this post, everything works as desired except that now, when the div is floated, the links at the top of the page do not work.  Apparently, anchor tags are not wanting to jump to an anchor that is in a floated element.

    While the application is in an intranet setting, I could whip together an example and send that.

    Thanks,
    Adam.g
  7. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 19 Jan 2010 Link to this post

    Hello Adam,

    An example will be great since the behavior remains unchanged here with or without the applied float.

    I did a simple test - I've set a name="test" to the last anchor on my test page and put href="#test" on the first one, they seem to navigate properly when all panels are open, tested in IE7/8 and Firefox 3.5. I'm attaching the test page.

    Sincerely yours,
    Kamen Bundev
    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
UI for ASP.NET Ajax is Ready for VS 2017