I'm new with Kendo UI PanelBar. I would like to expand the panelbar using javacript when the user click on a button. Thanks for your help.
@(Html.Kendo().PanelBar()
.Name("TestBar")
.Items(panelbar =>
{
panelbar.Add().Text("Additional Information")
.Content(@<text>@Html.Partial("Req") </text>);
})
)
Please try with the below code snippet. Call below funciton in your button click event.
<script>
function ExpandItemInPanelBar(){
var panelBar = $("#TestBar").data("kendoPanelBar");
// I have set 0 in 'eq(0)' so it will expand first item you can change it as per your code
panelBar.select(panelBar.element.children("li").eq(0));
var item = panelBar.select();
panelBar.expand(item);
}
</script>
Let me know if any concern.
Update 1:
//Check any item is expanded in panelbar
if(panelBar.element.children("li").hasClass("k-state-active") == true)
{
alert('items(s) expanded');
}
//Check every item is expanded or not in panelbar
items = panelBar.element.children("li");
for(var i = 0 ; i < items.Length; i++)
{
if($(items[i].hasClass('k-state-active'))
{
alert('this item is expanded');
}
}