Close panelbar

4 posts, 1 answers
  1. Anders
    Anders avatar
    10 posts
    Member since:
    Aug 2012

    Posted 31 Jan 2012 Link to this post

    I have a panelBar with expandMode 'single'. Can I make it collapse when I click on a expanden item.
    I want my user to be abel to collapse all items.
  2. Answer
    Dimo
    Admin
    Dimo avatar
    8423 posts

    Posted 31 Jan 2012 Link to this post

    Hi Anders,

    You can use the PanelBar's select event, check whether the currently clicked item is already expanded and if so, collapse it via the API.

    function expandCollapse(e) {
        if ($(e.item).is(".k-state-active")) {
            var that = this;
            window.setTimeout(function(){that.collapse(e.item);}, 1);
        }
    }
     
    var panelBar = $("#panelbar").kendoPanelBar({
        expandMode: "single",
        select: expandCollapse
    }).data("kendoPanelBar");


    Greetings,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Adam
    Adam avatar
    1 posts
    Member since:
    Oct 2015

    Posted 01 Dec 2017 in reply to Dimo Link to this post

    Just a suggestion...

    Make this a feature! It's a pretty common scenario and it would be great to just make it configurable.

    I currently have an instance where I want to mode to be "single" but also want the user to be able to collapse all items.

    In fact, I would want this to be the default behavior!

  4. Nencho
    Admin
    Nencho avatar
    1736 posts

    Posted 06 Dec 2017 Link to this post

    Hello Adam,

    Thank you for proposing the feature request. Actually, we use the following UserVoice portal, in order to consider and prioritize such suggested feature request, base on the demand and affect that they might have:

    http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback

    This is why, I would suggest you to log this as feature request, so it could be voted for and eventually escalated for implementation.

    Regards,
    Nencho
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top