ExpandMode Singele but allow close

7 posts, 1 answers
  1. Marcin
    Marcin avatar
    195 posts
    Member since:
    Jan 2011

    Posted 29 Sep 2016 Link to this post

    Hello

    I would ask about possibility to close last panel when expandmode is single. Multiple expand mode allows close all panels, single not.

    How to close all panels in single mode.

     

  2. Answer
    Eduardo Serra
    Admin
    Eduardo Serra avatar
    119 posts

    Posted 29 Sep 2016 Link to this post

    Hello Marcin,

    We can achieve this behavior by subscribing to the select event and, once it's triggered, checking if the selected panel is the active one and then using the collapse method.

    I have prepared a sample for you in the Kendo UI Dojo that follows this approach; you can take a look at it here.

    I hope this helps!

    Regards,
    Eduardo Serra
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Stuart
    Stuart avatar
    2 posts
    Member since:
    Feb 2017

    Posted 21 Mar 2018 in reply to Eduardo Serra Link to this post

    I tried this, but now I have lost the ability to expand the item?

    Stu

  4. Ivan Danchev
    Admin
    Ivan Danchev avatar
    2152 posts

    Posted 22 Mar 2018 Link to this post

    Hi Stu,

    I checked how the PanelBar from the dojo example Eduardo has posted (updated to use the latest official Kendo UI version) behaves and as can be seen in this screencast the item can be collapsed and then expanded. Could you modify the example accordingly so that it demonstrates the issue you are experiencing and link it back for further review?

    Regards,
    Ivan Danchev
    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.
  5. Stuart
    Stuart avatar
    2 posts
    Member since:
    Feb 2017

    Posted 22 Mar 2018 in reply to Ivan Danchev Link to this post

    Hi Ivan,

    because of the other code on my sharepoint page, I implemented it like so 

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

     

    and that is now working :)

    Thanks

     

  6. Kishore Kumar
    Kishore Kumar avatar
    8 posts
    Member since:
    Apr 2020

    Posted 01 Apr 2020 in reply to Stuart Link to this post

    how can we achieve the same operation in angular ?
  7. Ivan Danchev
    Admin
    Ivan Danchev avatar
    2152 posts

    Posted 03 Apr 2020 Link to this post

    Hi Kishore,

    For questions on Kendo UI for Angular components, please open a thread in the Kendo UI for Angular forums: https://www.telerik.com/forums/kendo-angular-ui/panelbar

    Regards,
    Ivan Danchev
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top