Loading Panelbar from Ajax/Json

[Rene]

I am trying to load the following dynamically to recreate a panelbar's complete contents.

Originally, the panel bar has no contents, and depending on a user's actions, I do an ajax call to get the new panelbar contents that returns the json structure below. 

var pb = $("#myPanelBar").data("kendoPanelBar");


var x =
      [
        {
          text: "Colors",         
          expanded: true,                                 
          items: [
            { text: "Red" },
            { text: "Green" },
            { text: "Blue" },
            { text: "Orange" },
            { text: "+ Add New" }
          ]
        },
        {
          text: "Animals",          
          expanded: true,                                 
          items: [
            { text: "Lion" },
            { text: "Eagle" },
            { text: "Lizzard" },
            { text: "+ Add New"}
          ]
        },
        {
          text: "Planets",          
          expanded: true,                                 
          items: [
            { text: "Pluto" },
            { text: "Mars" },
            { text: "Saturn" },
            { text: "+ Add New" }
          ]
        }
      ]

[Dimo]

Hello Rene,

Theoretically, it is possible to construct a PanelBar from an already existing instance, and append items via the widget's API:

http://demos.telerik.com/kendo-ui/panelbar/api
 
http://docs.telerik.com/kendo-ui/api/javascript/ui/panelbar

However, it will be a lot easier to create the PanelBar only after you have its items, and not before that. If you prefer to have an empty widget visible to the user initially, the you can destroy it and create a new instance on the same place.

http://docs.telerik.com/kendo-ui/framework/widgets/destroy

On a side note, please avoid posting duplicate forum threads, thank you.

Regards,
Dimo
Telerik