Question

我正在尝试创建一个嵌套的网格，该网格将获取数据并填充为2个网格（父级和子级）。

子网格只有1个父网格
子网格只能添加16行
删除父行会从服务器重新获取数据
子网格始终处于打开状态

类似于此http://dojo.telerik.com/UqURE

但最终应该看起来像这样https://photos.app.goo.gl/X6fcZ79779bgjrRZ8

Answer 1

您需要在视图中具有两个kendo网格和两个javaScript方法来获取其他数据az方法参数：

父网格及其子网格应如下所示：

<div class="row">
<div class="col-md-12">
    @(Html.Kendo().Grid<ProjectName.Models.ViewModel.TasksStaticViewModel>()
          .Name("grid")
          .DataSource(dataSource => dataSource
              .Ajax()
              .Read(read => read.Action("ReadActionName", "ControllerName").Data("additionalData"))
          )
          .Columns(columns =>
          {
              columns.Bound(c => c.Column1).HtmlAttributes(new { style = "text-align:center; overflow: hidden; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:center;" }).Width(130);
              columns.Bound(c => c.Column2).HtmlAttributes(new { style = "text-align:center; overflow: hidden; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:center;" }).Width(135);                  
          })

          .ToolBar(tool => tool.Template(
              @"<a id='lnkexportExcel' class='k-button k-button-icontext ' href='/Report/Tasks'><span></span>ExportToExcel</a>))
          .Pageable()
          .AutoBind(false)
          .Sortable()
          .Scrollable(s => s.Enabled(true))
          .ClientDetailTemplateId("template")               
    )
</div>
<div class="col-md-12">
    <script id="template" type="text/kendo-tmpl">
        @(Html.Kendo().Grid<ProjectName.Models.ViewModel.MyViewModel>()
          .Name("grid_#=Id#")
          .Columns(columns =>
          {
              columns.Bound(c => c.SubColumn1).HtmlAttributes(new { style = "text-align:center; overflow: hidden; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:center;" }).Width(100);
              columns.Bound(c => c.SubColumn2).HtmlAttributes(new { style = "text-align:center; overflow: hidden; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:center;" }).Width(100);
          })
          .DataSource(dataSource => dataSource
              .Ajax()
              .Read(read => read.Action("ReadActionName", "ControllerName",
                      new { AgentSelectedId = "#=AgentId#", TaskHeaderSelectedId = "#=TaskHeaderId#"})
                      .Data("additionalData2"))
          ) 
          .Pageable()
          .Sortable()
          .ToClientTemplate()
        )
    </script>
</div>

以及js JavaScript代码的另外两个数据：

function additionalData() {
        return someModel;}

function additionalData2() {
     return someModel;}

如果有用，请检查它是否可以作为答案

如何在剑道中创建嵌套网格？

1 个答案: