Telligent Tabbed Panes control in Client side access

Telligent community server system is really nice one. I like to work in that. In Now community server 5.5 they made little bit easy to create widgets and custom functions. While work in this CS, I used Telligents Tabbed panes to show better GUI in browser.  In this tabbed pane, in my functionality need to move from one tab to another tab when user click on hyperlink or button. So, I used firebug and   html view source to come over this.You can check the code below.  In community server 5.5 they’re using Jquery we can take advantage of that too..

This ASP.NET design Code:-

<TWC:TabbedPanes id=" MyTabs " runat="server"
PanesCssClass="tab-pane"
TabSetCssClass="tab-set"
TabCssClasses="tab"
TabSelectedCssClasses="tab selected"
TabHoverCssClasses="tab hover">
<TWC:TabbedPane ID="TabbedPane1" runat="server">
<Tab ID="Tab1" runat="server">Tab1</Tab>
<Content>
<a href=”#”  onclick=” HighlightTab(2)”>Go Tab 3</a>
</Content>
</ TWC:TabbedPane>

<TWC:TabbedPane ID=”TabbedPane2″ runat=”server”>
<Tab ID=”Tab2″ runat=”server”>Tab2</Tab>
<Content>
//You design
</Content>
</ TWC:TabbedPane>

<TWC:TabbedPane ID=”TabbedPane3″ runat=”server”>
<Tab ID=”Tab3″ runat=”server”>Tab3</Tab>
<Content>
//You design
</Content>
</ TWC:TabbedPane>
</ TWC:TabbedPanes>

For going to tab 1 to tab 3 Just I created one java script method like this

Javascript :-
<script type="text/javascript">
// <![CDATA[
function HighlightTab(tabindex)
{
var tabs = window.<%= MyTabs.ClientID %>;
//Here I know the tab index, so I passed index number. We can also use other method like getbyID
tabs.SelectTab(tabs.GetTabAtIndex(tabindex));
//Not only select tab, we can also get selected tab in javascript by using GetSelectedTab()

return false;  //just returning false to no more action
}
// ]]>
</script>
Not only get and set selected tabs. We can also add tab, remove tab, disable tab and many more. Just use firebug to get more details.

I hope, it will be useful for you to move from one tab to another tab, using java script.

Enjoy while coding..!

I would like to say thanks to Telligent..!

Thanks,

Naga Harish Movva.

Please  just ignore my, if I made any mistakes in the above message

One thought on “Telligent Tabbed Panes control in Client side access

Leave a Reply