RadTabStrip client side not found

4 posts, 0 answers
  1. Gary
    Gary avatar
    20 posts
    Member since:
    Oct 2012

    Posted 22 Jul 2013 Link to this post

    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?
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 23 Jul 2013 Link to this post

    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Gary
    Gary avatar
    20 posts
    Member since:
    Oct 2012

    Posted 23 Jul 2013 Link to this post

    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?
  5. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 24 Jul 2013 Link to this post

    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.
Back to Top