Add new tab by client-side script with scollbar problem

[Jason Lee]

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

[Atanas Korchev]

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

[DaveJones]

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);