Hi Team,

The rendered PanelBar automatically generates:

<ul role="tree">
    <li role="treeitem" aria-expanded="true">

These sections are not a hierarchical tree; they are used as accordion-like form sections. Due to the incorrect tree/treeitem roles, the screen reader is not able to identify and announce these sections correctly, which can cause confusing navigation for users relying on assistive technologies.

Please consider updating the role of the PanelBar to be an accordian instead of a tree.

Thank you!

Bug report

The dataBound event of the PanelBar does not fire when it is loaded with data through its Items configuration option. This is inconsistent with the behavior of the Kendo UI for jQuery PanelBar and the MVC TreeView, for which the event fires in the same scenario (local data).

Reproduction of the problem

Run the following example:

@(Html.Kendo().PanelBar()
    .Name("panelbar")
    .ExpandMode(PanelBarExpandMode.Single)
    .Events(events => events
        .DataBound("databound")
    )
    .Items(panelbar =>
    {
        panelbar.Add().Text("Root1")
            .Expanded(true)
            .Items(items =>
            {
                items.Add().Text("Sub-Item 2.1");
                items.Add().Text("Sub-Item 2.2");
            });

        panelbar.Add().Text("Root2")
            .Items(items =>
            {
                items.Add().Text("Sub-Item 2.1");
                items.Add().Text("Sub-Item 2.2");
            });
    })
)

<script>
    function databound(e) {
        alert('databound');
    }
</script>

Current behavior

The dataBound event does not fire.

Expected/desired behavior

The dataBound event fires.

Environment

• Kendo UI version: 2022.1.119
• jQuery version: x.y
• Browser: [all]