Open/Select KendoUI PanelBar

Question

When I click on a bar of a PanelBar I both select the option as well I toggle it (open / close). Is it possible not to open it but just select and click on the icon for controlling open/close?

score 2 · Accepted Answer · answered Nov 27 '12 at 17:44

2

I am afraid this is not supported. As a partial work-around you can make the PanelBar expand and select only by clicking the expand arrow like this:

$('#panelbarName>li').on('click',function(e){
   if(!$(e.target).is('.k-icon')){
      e.stopPropagation(); 
   }       
})

Unfortunately there is much more logic to be handled to just select (highlight the item) without expanding it.

answered Nov 27 '12 at 17:44

Petur Subev

19,983
3
52
68

I have accepted your proposal as answer event that is not complete (as you already pointed out) but I get the idea and actually I was looking if there was some (hidden) option for getting it. Not existing it, I will reconsider the UI for not looking for complex solutions. – OnaBai Nov 27 '12 at 22:11

score 1 · Answer 2 · edited Aug 28 '14 at 09:46

$("#panelbar>li").on("click", function (e) {
    if ($(e.target).is(".k-i-arrow-s")) {
        $("#panelbar").data("kendoPanelBar").expand($(e.target).closest("li"));
    }
    else if ($(e.target).is(".k-i-arrow-n")) {
        $("#panelbar").data("kendoPanelBar").collapse($(e.target).closest("li"));
    }
    else {
        $("#panelbar").data("kendoPanelBar").select($(e.target).closest("li"));
    }
    e.stopPropagation();
})

Open/Select KendoUI PanelBar

2 Answers2