Opening the First Item in a Panel

4 posts, 0 answers
  1. Joey
    Joey avatar
    3 posts
    Member since:
    Jul 2008

    Posted 06 Jun 2012 Link to this post

    I'm using the Kendo UI Web v2012.1.515 version and had a need to expand the first item in a dynamically created PanelBar (in code behind via c#). To make it more complicated, I'm working in SharePoint 2010. After sniffing around the DOM for a bit, I found a class on the first item in the panel "k-first". Since accessing the PanelBar.expand() method requires a jQuery selector, I decided to use this class as my selector...
    here's the code snippet...

    //pass the PanelBar into a JavaScript Object...
    var ScorecardList = $("ul[jqID|='ScorecardList']=").kendoPanelBar({ });

    //Show the first Item in the DisplyOrder Option List...via the k-first class...
    var FirstExpand = ScorecardList.data("kendoPanelBar").expand($(".k-first"));

    Disclaimer...this worked for me. This might not work in future releases, and may not work as described here. Your mileage may vary.
  2. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 07 Jun 2012 Link to this post

    Hi Joey,

    You can also omit the $() or use expand("> li:first") as a selector (to be sure it is the first descendant of the PanelBar root).

    Also, please note that expand() will return the PanelBar object, not the item.

    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!
  3. Kendo UI is VS 2017 Ready
  4. eliraz
    eliraz avatar
    20 posts
    Member since:
    Nov 2010

    Posted 19 Jun 2013 Link to this post

    and how can i select the son item for the first root item?
  5. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 25 Jun 2013 Link to this post

    Hello eliraz,

    You can use:
    $("#panelbar").data("kendoPanelBar")
        .expand(">li:first") //expand root
        .select(">li:first >.k-group >li:first"); //select the first son

    I hope this will help.

    Regards,
    Alexander Valchev
    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