Kendo Grid 데이터에서 Kendo TreeView 채우기

Question

동일한 페이지에 TreeView와 Grid가 모두 있고 GridView에서 TreeView를 채워야합니다. 따라서 흐름은 다음과 같습니다.

사용자가 드롭 다운에서 무언가를 선택하고 버튼 -> 웹 서비스 호출 -> 웹 서비스의 데이터로 그리드 채우기 -> 그리드 데이터의 일부 마사지로 TreeView 채우기

트 리뷰를 채우는 로직은 현재이 같은 grid.dataSource.fetch() 메소드에 그러나

// this function is called when user clicks on the button 
function getData() { 
    grid.dataSource.read(); 
    grid.dataSource.page(1); 

    grid.dataSource.fetch(function() { 
     var data = this.data(); 
     ... // logic to massage the data to populate TreeView 
     ... 
    } 
} 

, 사용자가 버튼을 다시 드롭 및 클릭에서 다른 것을 선택하는 경우,이. data()는 이전 데이터 (첫 번째 시간부터)를 가지고있는 것으로 보이며 결과적으로 TreeView는 이전 데이터로 채워집니다.

내 논리를 넣을 때 사용해야하는 fetch() 이외의 올바른 이벤트/방법은 무엇입니까?

Answer 1

나는 kendoGrid의 dataBound 이벤트를 사용해야한다고 생각합니다. http://docs.kendoui.com/api/web/grid#events-dataBound.

function Grid_DataBound(e) { 
    console.log("Grid_DataBound", e); 

    var grid = e.sender; 
    var dataItems = grid.dataSource.view(); 

    console.log(dataItems); 

    var treeData = new Array(); 

    for (var i = 0; i < dataItems.length; i++) { 
     treeData.push({ 
      OrderId: dataItems[i].OrderID, 
      ShipName: dataItems[i].ShipName 
     }); 
    } 

    var dataSource = new kendo.data.HierarchicalDataSource({ 
     data: treeData, 
     schema: { 
      model: { 
       id: "OrderId" 
      } 
     } 
    }); 

    $("#treeview").data("kendoTreeView").setDataSource(dataSource); 
} 

하면 전체 샘플 코드가 필요 알려줘 : 여기

샘플 kendoGrid 바인딩 된 이벤트 처리기에 대한 코드입니다.