I am trying to populate the kendo panel control using the below json

var jsondata = { "Heading 1": 
[{ "ID": 1, "Name": "TEST 1" }, { "ID": 2, "Name": "TEST 2" }, 
{ "ID": 3, "Name": "TEST 3" }, { "ID": 4, "Name": "TEST 4" }, 
{ "ID": 5, "Name": "TEST 5" }, { "ID": 6, "Name": "TEST 6" },
],
 "Heading 2": 
 [{ "ID": 1, "Name": "TEST 1" }, { "ID": 2, "Name": "TEST 2" },
 { "ID": 3, "Name": "TEST 3" }], 

 "Heading 3": [{ "ID": 1, "Name": "TEST 1" }, 
 { "ID": 2, "Name": "TEST 2" },
 { "ID": 3, "Name": "TEST 3" }] };

Heading 1, Heading 2, Heading 3 will be the heading of the panels and the "Name" will be the subitems

JS FILE :

$(document).ready(() => {
    $("#pageLoader").hide();

    $("#panelbar").kendoPanelBar();
    var panelBar = $("#panelbar").data("kendoPanelBar");



    $.each(Object.keys(jsondata), function (i, row) {
      // trying to get all the names into an array
        let array = new Array(Object.values(jsondata)[i].length);

        $.each(Object.values(jsondata)[i], function (j, datarow) {

            array[j] = Object.values(jsondata)[i][j].Name;
        });



        panelBar.append([
            {
                text: row,
                items:  ??? 

            }
        ]);
    });
}); 

Below are the things I have tried :

items : array (subitems are populated but they are shown as "undefined")

items : [{text :  array }] (all the subitems are displayed as one item with comma separated values)

How are we supposed to give:

items : [{

text : "TEXT 1"

},

{

text : "TEXT 2"

}

]

I want to do the above thing but not hard code. In a loop or something.

Hello guys, I hope you are all well.

I have a question about the KendoUI version 2014.1.416 as I am facing some issues with the kendoSortable() function.

At the moment, the jQuery version is the latest (3.6.0) and I have also placed the latest jQuery Migrate version (3.2.2) but the .data("kendoGrid") function always returns an "undefined" result, meaning that it does not find the actual grid.

Do you happen to know whether the problem is the latest jQuery version or the syntax to get the kendoGrid?

Below I have placed the JS line of code to fetch the grid.

- code sample: var grid = e.detailRow.find(".js-filter-conditions-grid").data("kendoGrid");

Regards,

R