Wie man Daten für Kendoui Baumstruktur manuell einstellt

Question

Ich möchte die Datenquelle für eine Kendoui Baumstruktur zur Laufzeit einstellen. Bitte überprüfen Sie folgende example. Wenn ich die Datenquelle zur Entwurfszeit einstelle, kann ich die Daten im Steuerelement sehen. Aber wenn ich versuche, die Datenquelle zur Laufzeit zu setzen, sehe ich die Daten im Steuerelement nicht.

<div id="treeList"></div> 
<script> 
    var data = [ { name: "Jane Doe" }, { name: "John Doe" }]; 

    var dataSource = new kendo.data.TreeListDataSource({ 
     data: [ { name: "Jane Doe" }, { name: "John Doe" }] 
    }); 
    $("#treeList").kendoTreeList({ 
     columns: [ 
      { field: "name" }, 
      { command: [{ name: "edit" }] } 
     ], 
     editable: true 
     //,dataSource: dataSource 
    }); 
    var grid = $("#treelist").data("kendoTreeList"); 
    grid.setDataSource(dataSource); 
    grid.dataSource = dataSource; 
    grid.dataSource.read(); 
    grid.dataSource.data(data); 
</script> 

Answer 1

Das Problem scheint mit dem Selektor selbst zu sein. Ihre Logik war in Ordnung, aber aus irgendeinem Grund war das von data("kendoTreeList") zurückgegebene Objekt null. Ich habe Ihren Code aktualisiert, um die data nach der kendoTreeList Initialisierung zu verketten.

var dataSource = new kendo.data.TreeListDataSource({ 
    data: [ { name: "Jane Doe" }, { name: "John Doe" }] 
}); 

var grid = $("#treeList").kendoTreeList({ 
    columns: [ 
     { field: "name" }, 
     { command: [{ name: "edit" }] } 
    ], 
    editable: true 
}).data("kendoTreeList"); 

grid.setDataSource(dataSource); 

Es ist ein bisschen seltsam zu sagen, aber ich dachte, dass Ihr Code und mein Code gleichwertig wären. Offensichtlich ist es nicht, aber ich kann nicht herausfinden warum.