Access radtab defined in parent page from usercontrol javascript

[Suchitra]

Hi, I have a RADTabStrip defined in my page.
On clicking one of the tabs i load a user control.
Now in the user control, i have a button and a click handler for the same.
In the button click handler (client side function), i would like to change the text of the tab.
I saw examples which use something like $find("<%= RadTabStrip1.ClientID %>")
But I am not sure how to use this when the RadTabStrip is defined in the parent page.
Please provide clues / suggestions on how to get this done.

Thanks
Suchitra

[Nencho]

Hello Suchitra,

You could hard-code the ID of the RadTabStrip in attempt to get a reference and then alter a desirable Tab's Text. Please consider the following approach as an example :

1.<script type="text/javascript">
2.    function OnClientClicked() {
3.        $find("RadTabStrip1").get_tabs().getTab(1).set_text("Tab Modified");
4.    }
5.</script>

In addition, please make sure that you are passing the proper ID of the RadTabStrip, since if you are using a Maser/Content page scenario, the IDs will be slightly changed. Here is a video, demonstrating the behavior at my end.


Regards,
Nencho
Telerik

 

 

[Suchitra]

Hello Nencho - Thanks for your response.
I tried your approach, however was not completely successful.

In the client click function, the command 
alert($find("ctl00_MainContent_RadTabStrip1").get_tabs().getTab(1).get_text());
worked well and it returned me the tab text.

However, the command 
$find("ctl00_MainContent_RadTabStrip1").get_tabs().getTab(1).set_text("Tab Modified")
did not modify the tab text.

The main difference between your example and my code is: i am adding the tabs dynamically very similar to the demo: http://demos.telerik.com/aspnet-ajax/tabstrip/examples/application-scenarios/add-remove-tabs/defaultcs.aspx

Not sure if the code is supposed to work in this scenario. 

Thanks
Suchitra

[Nencho]

Hello Suchitra,

Indeed the previously demonstrated approach will not be valuable for the demonstrated scenario, since in you are using the ItemTemplate to evaluate the Text of the RadTabs as Labels. Hence, I would suggest you to use jQuery, in order to modify the desired Tab's Text in the following manner :

<script type="text/javascript">
       var $ = $telerik.$;
       function OnClientClicked() {
           var tabStrip = $find("ctl00_MainContent_RadTabStrip1");
           var span = $(tabStrip.get_tabs().getTab(1).get_element()).find('span');
           $(span).text("ModifiedText");
       }
   </script>

Regards,
Nencho
Telerik

 

 

[Suchitra]

Awesome! Worked just fine. Thanks so much for the effort you took to provide the right solution, Nencho.
Appreciate the same!

Thanks
Suchitra