Select tab by id given on creation

6 posts, 0 answers
  1. Jhonny
    Jhonny avatar
    2 posts
    Member since:
    Jan 2012

    Posted 05 Jan 2012 Link to this post

    Hello,

    I need to somehow select specific tab. I was trying something like:

    tabStrip.append(
                [
                    {
                        id: "myId1",
                        text:title,
                        contentUrl:url
                    }
                ]
            );
    ...
    tabStrip.select("#myId1");


    But it did not work. How I can do such thing (e.g. select a specific tab)? Should I count each added tab manually and select by index? How tabStrip.select works?

    Thank you.
  2. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 09 Jan 2012 Link to this post

    Hello Jhonny,

    The TabStrip select() method selects the DOM element/jQuery selector you pass to it. However, the append method doesn't support passing an id to it, so you would have to set it later or just use jQuery to match an element and select it.

    All the best,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Cary
    Cary avatar
    1 posts
    Member since:
    Feb 2013

    Posted 12 Mar 2013 Link to this post

    I'm running into the same issue when adding tabs via the dataSource. http://jsfiddle.net/v5URa/3/
    How do you recommend setting the id later?

    Thanks
  5. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 15 Mar 2013 Link to this post

    Hi Cary,

    You don't need to number your tabs in order to select them - you can pass the tab number to the select method and it will get selected:
    tabStrip.select(1);

    You can also pass a jQuery selector that would match your TabStrip item (a LI element) by text:
    tabStrip.select("li:contains(tab 2)");

    There were also other issues with your jsFiddle - you were using the very first version of Kendo UI in it, one that is almost 2 years old now - and to get the TabStrip javascript object, you need to get its data, not the init result. I've updated it to fix these and to use the second method.

    Regards,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Zachary
    Zachary avatar
    3 posts
    Member since:
    Apr 2014

    Posted 28 Dec 2015 Link to this post

    I need a unique identifier as part of a tab "li". I don't like having to select via index (unknown) or title text (not unique). This seems like it should be standard as most controls allow a template or property to accomplish this.
  7. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 04 Jan Link to this post

    Hi Zachary,

    As the "append" method always appends the new tab at the end of the collection you can select the new tab using jQuery and set it's "id" attribute. For convenience I created small example which you can use as baseline:

    Regards,
    Vladimir Iliev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready