刷新父Kendo MVC Grid當子網格更新時

Question

我想在更新子網格記錄時更新父網格，這可能嗎？如果有的話，任何人都可以提供任何建議嗎？

首先，我不確定哪個事件最適合在子網格上使用。我想要觸發子網格的CRUD動作，然後再次加載父級的內容，最好由Ajax加載。

下面是我的網格，就是：

@{ 
    ViewBag.Title = "Bills: Parent/Child"; 
} 

<h2>Bills Index</h2> 

@(Html.Kendo().Grid<BillParent>() 
    .Name("BillParentsGrid") 
    .Columns(columns => 
    { 
     columns.Bound(h => h.Category); 
     columns.Bound(h => h.Description); 
     columns.Bound(h => h.Amount); 
     columns.Command(command => 
     { 
      command.Edit(); 
     }).Width(95); 
    }) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Model(model => 
     { 
      model.Id(h => h.BillId); 
      model.Field(h => h.BillId).Editable(false); 
     }) 
     .Events(events => events.Error("error_handler")) 
     .Read(read => read.Action("BillParents_Read", "Bill")) 
     .Update(update => update.Action("BillParent_Update", "Bill")) 
    ) 
    .Events(events => events.DataBound("dataBound")) 
    .ClientDetailTemplateId("BillChildren") 

    ) 

<script id="BillChildren" type="text/kendo-tmpl"> 
    @(Html.Kendo().Grid<BillChild>() 
      .Name("BillChildren_#=BillId#") 
      .Columns(columns => 
      { 
       columns.Bound(d => d.BillId).Width(50); 
       columns.Bound(d => d.Description).Width(150); 
       columns.Bound(d => d.Amount).Width(80); 
       columns.Command(command => 
       { 
        command.Edit(); 
        command.Destroy(); 
       }).Width(55); 
      }) 
      .DataSource(dataSource => dataSource 
       .Ajax() 
       .Model(model => 
       { 
        model.Id(d => d.BillId); 
        model.Field(d => d.BillId).Editable(false); 
       }) 
      .Events(events => events.Error("error_handler")) 
      .Read(read => read.Action("BillChildren_Read", "Bill", new { id = "#=BillId#" })) 
      .Update(update => update.Action("BillChild_Update", "Bill")) 
      .Create(create => create.Action("BillChild_Create", "Bill", new { id = "#=BillId#" })) 
      .Destroy(destroy => destroy.Action("BillChild_Destroy", "Bill"))) 

      .ToolBar(tools => tools.Create()) 
      .ToClientTemplate() 
     ) 
</script> 

非常感謝。

Answer 1

我最終破解了它。

該事件需要在dataSource上使用Sync事件，而不是在網格上。

短版

.DataSource(dataSource => dataSource 
        .Ajax() 
        .Model(model => 
        { 
         model.Id(d => d.BillId); 
         model.Field(d => d.BillId).Editable(false); 
        }) 
        .Events(events => 
        { 
         events.Error("error_handler"); 
         events.Sync("resyncParentGrid"); 
        }) 

    <script> 
     function resyncParentGrid(e) { 
      var parentData = $('#BillParentsGrid').data("kendoGrid"); 
      parentData.dataSource.read(); 
     } 
    </script> 

完整版本

@(Html.Kendo().Grid<BillParent>() 
    .Name("BillParentsGrid") 
    .Columns(columns => 
    { 
     columns.Bound(h => h.Category).Width(50); 
     columns.Bound(h => h.Description); 
     columns.Bound(h => h.Amount).Width(80); 
     columns.Command(command => 
     { 
      command.Edit(); 
     }) 
     .Title("Commands").Width(150); 
    }) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Model(model => 
     { 
      model.Id(h => h.BillId); 
      model.Field(h => h.BillId).Editable(false); 
     }) 
     .Events(events => events.Error("error_handler")) 
     .Read(read => read.Action("BillParents_Read", "Bill")) 
     .Update(update => update.Action("BillParent_Update", "Bill")) 
    ) 
    .Events(events => events.DataBound("dataBound")) 
    .ClientDetailTemplateId("BillChildren") 

    ) 

<script id="BillChildren" type="text/kendo-tmpl"> 
    @(Html.Kendo().Grid<BillChild>() 
      .Name("BillChildren_#=BillId#") 
      .Columns(columns => 
      { 
       columns.Bound(d => d.BillId).Width(50); 
       columns.Bound(d => d.Description).Width(150); 
       columns.Bound(d => d.Amount).Width(80); 
       columns.Command(command => 
       { 
        command.Edit(); 
        command.Destroy(); 
       }) 
        .Title("Commands").Width(150); 
      }) 
      .DataSource(dataSource => dataSource 
       .Ajax() 
       .Model(model => 
       { 
        model.Id(d => d.BillId); 
        model.Field(d => d.BillId).Editable(false); 
       }) 
       .Events(events => 
       { 
        events.Error("error_handler"); 
        **events.Sync("resyncParentGrid");** 
       }) 
       .Read(read => read.Action("BillChildren_Read", "Bill", new { id = "#=BillId#" })) 
       .Update(update => update.Action("BillChild_Update", "Bill")) 
       .Create(create => create.Action("BillChild_Create", "Bill", new { id = "#=BillId#" })) 
       .Destroy(destroy => destroy.Action("BillChild_Destroy", "Bill")) 
     ) 
      .ToolBar(tools => tools.Create()) 
      .ToClientTemplate() 
     ) 
</script> 



<script> 
    function dataBound() { 
     this.expandRow(this.tbody.find("tr.k-master-row").first()); 
    } 

    function resyncParentGrid(e) { 
     var parentData = $('#BillParentsGrid').data("kendoGrid"); 
     parentData.dataSource.read(); 
    } 
</script>