询问剑道ui，如何使用ajax从另一个页面调用数据？

Question

假设我的页面 A 看起来像这样：

<div class="buttonsarea">
            @*@Html.ButtonWithPrivilege("button", PrivilegeCode.Create, ControllerHelper.GetCurrentControlerName(), @SharedResource.AddButton, new { @class = "button green", @id = "btnCreateGroup", onclick = "onCreateGroup(event)" })
                <button type="button" class="button red" onclick="closeInnerWindow(this);" >@SharedResource.CancelButton</button>
                <button type="button" class="button yellow" onclick="clearInputForm();">@SharedResource.ClearButton</button>*@
        </div>
    }
</div>
@(Html.Kendo().Grid<Model.Role>()
        .Name("GroupsGrid")
        .ToolBar(toolBar => toolBar.Template(
         @<text>

            <div class="input-group searchButton">
                <input type="text" id="searchKey" class="form-control" autocomplete="off" placeholder="@SharedResource.SearchButton" aria-label="@SharedResource.SearchButton" aria-describedby="basic-addon2">
                <div class="input-group-append">
                    <button id="btnSearch" class="btn btn-outline-primary" type="button">@SharedResource.SearchButton</button>
                </div>
            </div>

        </text>))
        .Columns(columns =>
        {

然后我使用 ajax 调用另一个页面（下面的代码）将此代码添加到剑道窗口中，但由于模板无效，我无法使用哈希转义，因为那时我无法得到结果，我应该怎么做才能解决这个问题？

    @{
    var roleId = ViewData["GroupId"] as String;
    var columnWidth = 50;
    Layout = null;
}
@using BackEnd.Helpers
@Html.Hidden("GroupId", roleId)

@{Html.Kendo().Grid<Model.Menu>()
                .Name("GridMenus")
                .Columns(columns =>
                {
                    columns.Bound(o => o.TextEng).ClientTemplate("<# if ( ParentId == 0 ) { #>" +
                        "<div class='privilege-lvl-0'><a id='<#= MenuId #>' href='#' title='<#= TextThai #>'><#= TextEng #></a></div>" +
                        "<# } else if( HasChild == 0 && MenuLevel > 0 ) { #>" +
                        "<div class='privilege-lvl-1'><a id='<#= MenuId #>' href='#' title='<#= TextThai #>'><#= TextEng #></a></div>" +
                        "<# } else if( HasChild < 0 && MenuLevel > 1 ) { #>" +
                        "<div class='privilege-lvl-2'><a id='<#= MenuId #>' href='#' title='<#= TextThai #>'><#= TextEng #></a></div>" +
                        "<# } else { #>" +
                        "<div class='privilege-lvl-3'><a id='<#= MenuId #>' href='#' title='<#= TextThai #>'><#= TextEng #></a></div>" +
                        "<# } #>"
                       ).Title(@Privilege.PageName).Width(200);
                    columns.Bound(o => o.MenuId).HeaderTemplate(@<text>
@Privilege.View
                    </text>).ClientTemplate("&nbsp;").Width(columnWidth);
               columns.Bound(o => o.MenuId).HeaderTemplate(@<text>
@Privilege.Create
            </text>).ClientTemplate("&nbsp;").Width(columnWidth);
                columns.Bound(o => o.MenuId).HeaderTemplate(@<text>
@Privilege.Update
                </text>).ClientTemplate("&nbsp;").Width(columnWidth);
                     columns.Bound(o => o.MenuId).HeaderTemplate(@<text>
@Privilege.Delete
                    </text>).ClientTemplate("&nbsp;").Width(columnWidth);
                      })
           .DataSource(dataBinding =>
           {
               dataBinding.Ajax().Read("GetMenuList", "UserPrivilegeManagement").PageSize(22);
           })
           .Events(clientEvents => clientEvents
           .DataBound("GridMenus_onRowDataBound")
           //.OnComplete("GridMenus_onComplete")
           )
           .Scrollable(scrolling => scrolling.Height(336))
           .Pageable(paging => paging.PageSizes(BackEnd.Helpers.GridHandler.PageSize))

以下是错误：

Uncaught Error: Invalid template:'<tr data-uid="#=data.uid#" role='row'><td data-field="TextEng"class="#= data && data.dirty && data.dirtyFields && data.dirtyFields['TextEng'] ? ' k-dirty-cell' : '' #" role='gridcell'>#= data && data.dirty && data.dirtyFields && data.dirtyFields['TextEng'] ? '<span class="k-dirty"></span>' : '' #<//# if ( ParentId == 0 ) { <div class='privilege-lvl-0'><a id='//#= MenuId //#' href='//#' title='//#= TextThai //#>' //#= TextEng //#</a></div> }//</td><td data-field="MenuId"class="#= data && data.dirty && data.dirtyFields && data.dirtyFields['MenuId'] ? ' k-dirty-cell' : '' #" role='gridcell'>#= data && data.dirty && data.dirtyFields && data.dirtyFields['MenuId'] ? '<span class="k-dirty"></span>' : '' # </td><td data-field="MenuId"class="#= data && data.dirty && data.dirtyFields && data.dirtyFields['MenuId'] ? ' k-dirty-cell' : '' #" role='gridcell'>

Answer 1

你必须用\\# 逃脱#。示例：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Untitled</title>

  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.common.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.rtl.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.default.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.mobile.all.min.css">

  <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2020.1.406/js/angular.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2020.1.406/js/jszip.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2020.1.406/js/kendo.all.min.js"></script></head>
<body>
  
  <script>
    document.write(kendo.template('<a href="\\#">My anchor</a>')({}));
  </script>
</body>
</html>

Reference

Answer 2

经过数小时的搜索后，我得到了新的解决方案，我使用 myTemplate 调用 javascript 然后执行 if else 里面的事情并返回值：

columns.Bound(o => o.TextEng).ClientTemplate("#=myTemplate(data)#").Title(@Privilege.PageName).Width(200);

<script>
function myTemplate(data) {
    if (data.parentId == 0)
    {
        return '<div class="privilege-lvl-0">' + data.TextEng + '</div>';
    }else { ... }