Add new tab by client-side script with scollbar problem

3 posts, 1 answers
  1. Jason Lee
    Jason Lee avatar
    185 posts
    Member since:
    Oct 2004

    Posted 01 Jun 2008 Link to this post

    Dear Sir,

    I am using javascript to add some new tabs.  After total tabs are more than expected, the scrollbar should be displayed.  However, the scrollbar doesn't.

    Anything I can do to get this goal without postback?
    Thank you
  2. Answer
    Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 02 Jun 2008 Link to this post

    Hello Jason Lee,

    Indeed this is currently not supported out of the box. However you can try calling the "repaint" client-side method of RadTabStrip after adding a tab:

                var tabStrip = $find("RadTabStrip1");
                var tab = new Telerik.Web.UI.RadTab();
                tab.set_text("Test");
                tabStrip.get_tabs().add(tab);
                tabStrip.repaint();


    Regards,
    Albert
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. DaveJones
    DaveJones avatar
    4 posts
    Member since:
    Apr 2007

    Posted 19 Jul 2008 Link to this post

    Hopefully this wasn't fixed and I didn't notice 8P  Anyways, I got burned by this but found an 'ok' work-around (ok for me anyways).

    If I had a blank tabstrip and added my tabs client-side, the scroll bars wouldn't show in IE after calling repaint (firefox was fine but the animation is kind of busted).  However, if there is atleast 1 tab added server-side, adding tabs client-side doesn't appear to break anything and preserves the scrolling functionality and the animation remains smooth.

    I just add a stub tab server-side and remove it client-side.  I haven't bothered with any hand-waving to hide it initially, but I'm sure some JS that tweaks the display css of the tabstrip will work.

    var tabStrip = $find("RadTabStrip1");  
    var tab = new Telerik.Web.UI.RadTab();  
    tab.set_text("Test");  
    tabStrip.get_tabs().add(tab);  
    tabStrip.repaint();  
    tabStrip.get_tabs().removeAt(0); //remove stub tab  
    tabStrip.set_selectedIndex(0); 

Back to Top