RadTabStrip client side not found

[Gary]

Hi,
I am trying to find my RadTabStrip client side and then work with it in javascript. But when I use the $find() method, it just returns null. 

Here's something like what I'm doing:

function tabStripManipulation{
    var tabStrip = $find('<%= this.myTabStrip.ClientID%>');
    if (!tabStrip) {
        return;
    }
    var tab = tabStrip.findTabByText("Document");
    // do more stuff here....
    ...
}

Whenever the method checks to make sure that tabStrip is not null, it fails and returns.

What am I missing here?

[Shinu]

Hi Gary,

Please have a look into the following code I tried which works fine at my end.

ASPX:

<telerik:RadTabStrip ID="myTabStrip" runat="server" MultiPageID="RadMultiPage1" Skin="Silk">
    <Tabs>
        <telerik:RadTab runat="server" Text="Documents" PageViewID="RadPageView1">
        </telerik:RadTab>
        <telerik:RadTab runat="server" Text="Projects" PageViewID="RadPageView2">
        </telerik:RadTab>
    </Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="RadMultiPage1" runat="server">
    <telerik:RadPageView runat="server" ID="RadPageView1">
        Documents
    </telerik:RadPageView>
    <telerik:RadPageView runat="server" ID="RadPageView2">
        Projects
    </telerik:RadPageView>
</telerik:RadMultiPage>
<br />
<telerik:RadButton ID="RadButton1" runat="server" Text="Change Font" AutoPostBack="false"
    OnClientClicked="tabStripManipulation">
</telerik:RadButton>

JavaScript:

<script type="text/javascript">
    function tabStripManipulation() {
        var tabstrip = $find('<%= this.myTabStrip.ClientID%>'); //accessing RadTabStrip
        if (!tabstrip) {
            return;
        }
        tabStrip.findTabByText("Documents").set_selected(true); //Accessing a particular RadTab based on text and selecting it.
    }
</script>

Thanks,
Shinu.

[Gary]

Thanks Shinu.

I looked into this a little bit more. I examined the html output of the page and I do see that the $find('<%= this.myTabStrip.ClientID%>') method is resolving to the ID of the div where my RadTabStrip is located but as I said, the check if(!tabStrip) still fails. This tells me that I am not grabbing the client side object for the tabstrip. What would cause this to happen? Do I need to make sure that the tabstrip is inside some other element in order for the client object to be accessible?

[Shinu]

Hi Gary,

I apologize for giving different variable names in my previous post. Please try the updated code.

JavaScript:

<script type="text/javascript">
    function accessTab(sender, args) {
        var tabstrip = $find('<%= this.myTabStrip.ClientID%>');
        if (tabstrip != null) {
            return;
        }
        tabstrip.findTabByText("Documents").set_selected(true)
    }
</script>

Thanks,
Shinu.