Deux Kendo UI TreeView sur la même page

Question

J'utilise les extensions Kendo UI MVC. J'ai une vue arborescente sur la page

<script type="text/x-kendo-tmpl" id="template"> 
    <div class="form"> 
     <h3>${Name}</h3> 
    </div> 
</script> 

@(Html.Kendo().ListView(Model) 
     .Name("formsList") 
     .ClientTemplateId("template") 
     .TagName("div") 
     .BindTo(Model) 
     .DataSource(dataSource => dataSource 
     .Model(model => 
      { 
       model.Id(p => p.Id); 
       model.Field(p => p.Name); 
       model.Field(p => p.Fields); 
      })) 
     .Pageable() 
     .Selectable(selectable => selectable.Mode(ListViewSelectionMode.Single)) 
     .Events(events => events.Change("onChange"))) 

Lorsque je clique sur l'article que je veux montrer Fields propriété dans mon modèle dans le TreeView séparé en bas.

Jusqu'à présent, j'ai un tel code

<script type="text/javascript"> 
    function onChange(arg) { 
     var dataSource = $("#formsList").data("kendoListView"); 
     var index = dataSource.select().index(); 
     var dataItem = dataSource.dataSource.view()[index]; 

     alert(dataItem.Fields); 
    } 
</script> 

Je peux obtenir la propriété Fields du DataItem sélectionné, mais comment dois-je passer à la deuxième TreeView?

Answer 1

En principe, vous devez affecter l'élément sélectionné en tant que source de données de la seconde arborescence de Kendo ou directement à la source de données utilisée pour votre première arborescence. (vous posez des questions sur treeview et vous montre des exemples de listview?)

<div id="treeview"></div> 
<script type="text/javascript"> 

var myDataSource = new kendo.data.DataSource({ 
         data: dataSource.dataSource.view()[index]});  
$("#treeview").kendoTreeView({ 
        dataSource: myDataSource 
       }).data("kendoTreeView");