Kendo UI 分层网格中的自定义弹出式编辑器

Question

我有一个分层网格，我正在尝试为弹出窗口编辑添加一个自定义编辑器。当我将模板添加到子网格并单击 "edit" 按钮时，出现无效模板错误。如果我将相同的模板添加到父级，它工作正常。

这是控制台中的错误：

未捕获错误：模板无效：'

这是代码

  @(Html.Kendo().Grid<ParentViewModel>()
                  .Name("GridAdjax")
                  .DataSource(dataSource => dataSource
                      .Ajax()
                      .PageSize(20)
                      .Events(events => events.Error("error_handler"))
                      .Read(read => read.Action("Read", "controller"))
                      .Model(model =>
                      {
                          model.Id(c => c.Id);
                      })
                      .ServerOperation(false)
                      .Events(events => events.Error("error_handler"))
                      .Events(events => events.RequestEnd("onRequestEnd"))

                  )
                  .Columns(columns =>
                  {
                      columns.Bound(p => p.CompanyName).Title("Company Name");
                      columns.Bound(p => p.CompanyDomain).Title("Company Domain");
                      columns.Bound(p => p.CompanySecurityRole).Title("Security Role");
                      columns.Bound(p => p.CompanySecurityGroup).Title("Security Group");
                  })
                  .ClientDetailTemplateId("template")
                  .Pageable()
                  .Sortable()
                  .Resizable(resize => resize.Columns(true))
                  .Events(e => e.DataBound("OnDataBound"))
                  .Deferred()

                  )
<CHILD>
            <script id="template" type="text/kendo-tmpl">
                @(Html.Kendo().Grid<ChildlViewModel>()
            .Name("grid_#=CompanyId#") 
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(10)
                .Update(update => update.Action("CompanyList_Update", "Administration"))
                .Read(read => read.Action("Read", "Child", new { companyId = "#=CompanyId#" }))
                        .Model(model =>
                              {
                                  model.Id(c => c.Id);
                                  model.Field(c => c.CompanySoldTo).Editable(true);
                                  model.Field(c => c.CompanyDistributionChannel).Editable(true);
                                  model.Field(c => c.CompanyDivision).Editable(true);
                                  model.Field(c => c.CompanyPlant).Editable(true);
                                  model.Field(c => c.CompanySalesOrg).Editable(true);
                              })
            )
            .Columns(columns =>
                  {
                      columns.Bound(p => p.CompanySoldTo).Title("Sold To");
                      columns.Bound(p => p.CompanyDistributionChannel).Title("Dist. Chan.");
                      columns.Bound(p => p.CompanyPlant).Title("Plant");
                      columns.Bound(p => p.CompanySalesOrg).Title("Sales Org");
                      columns.Command(command => { command.Edit(); }).Title(("Edit SAP Info."));
                  })
                    .Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("Detail"))
            .Pageable()
            .Sortable()
            .ToClientTemplate()
                )
            </script>
            <script>
                function dataBound() {
                    this.expandRow(this.tbody.find("tr.k-master-row").first());
                }
            </script>

Answer 1

如果以后有人遇到这个问题，问题实际上出在我的自定义弹出编辑器模板中。我在设置为 "Please enter your account #" 的输入框之一上收到了一条数据验证消息。 Kendo 将“#”解释为模板。我转义了 # 然后能够成功加载它。