This is a migrated thread and some comments may be shown as answers.

Panelbar not working when using expanded: true in datasource

3 Answers 718 Views

PanelBar

This is a migrated thread and some comments may be shown as answers.

Inception asked on 23 Jun 2017, 09:05 AM

Hi,

I am experiencing a problem with panelbar with the latest kendo ui release. When using a (local) datasource which contains items with the 'expanded' option set to true, the corresponding panelbar item doesn't work. Neither the item gets expanded by default, the item does not expand when clicking the item.

Reverting back to an older version, for instance Kendo UI R3 SP2, thing are working properly. I have tried making a dojo example but at the moment I don't seem to be able to save the example ("Failed to create snippet"). I will add the code at the end of this psot.

On a side note: when using 'contentUrl', the content doesn't get loaded when clicking the non-responsive item. This might be as a result to the item not being expanded properly.

Regards,
Ron

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Untitled</title>

<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.2.621/styles/kendo.common.min.css">

<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.2.621/styles/kendo.rtl.min.css">

<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.2.621/styles/kendo.default.min.css">

<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.2.621/styles/kendo.mobile.all.min.css">

<script src="http://code.jquery.com/jquery-1.12.3.min.js"></script>

<script src="http://kendo.cdn.telerik.com/2017.2.621/js/angular.min.js"></script>

<script src="http://kendo.cdn.telerik.com/2017.2.621/js/jszip.min.js"></script>

<script src="http://kendo.cdn.telerik.com/2017.2.621/js/kendo.all.min.js"></script>

<script>

$(document).ready(function() {

$("#kendoBar").kendoPanelBar({

dataSource: [{

text: 'Test expanded not present (WORKING)',

expanded: false,

content: "Will work because no expanded option is provided"

}, {

text: 'Test expanded option is present (NOT WORKING)',

expanded: true,

content: "Will not work with the expanded option"

}]

});

</script>

</head>

<body>

<h2>Kendo PanelBar v2017.2.504 not working</h2>

<h3>Test kendoPanelBar: expanded: true not working</h3>

<div id="kendoBar"></div>

<p>

Also: contentUrl is not loaded on load, but is loaded when clicked on the item

</p>

</body>

</html>

Panelbar not working when using expanded: true in datasource

3 Answers, 1 is accepted