Question

网格，带有自定义命令，用于打开带有详细数据的kendo窗口。如下所述：

http://demos.telerik.com/kendo-ui/grid/custom-command

我通过php脚本f.e将网格数据加载为json。 employees.php。

在示例中，单击＆＃34;查看详细信息＆＃34; Windows从同一数据源加载数据。

我需要的是从另一个php / json文件加载详细数据。我发现它应该与＆＃34;刷新＆＃34;方法，但我没有让它工作。

有人可以帮帮我吗？

更新

感谢@Karthikeyan，我的代码现在看起来像这样：

        <script>
... function showDetails(e) {
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    var dataItemID = dataItem.AK_ID;
    $.getJSON('data/akDetail.php?ak=' + dataItemID + '', function (data) {
        wnd.content(detailsTemplate(data));
        wnd.center().open();
    });
}
</script>
<script type="text/x-kendo-template" id="template">
<div id="details-container">
    <h2>#= title_dataitem #</h2>
</div>
</script>

kendo窗口无法打开，我在chrome控制台中收到错误：＆＃34; Uncaught ReferenceError：title_dataitem未定义＆＃34;

Answer 1

在演示网格中，行 wnd.content（detailsTemplate（dataItem））; 将模板与当前行的数据绑定。你可以改为做

之类的事情

function showDetails(e) {
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    $.getJSON('/dataSource.php', { param1: dataItem.param1, param2: dataItem.param2 }, function (data) {
        wnd.content(renderTemplate(data));
        wnd.center().open();
    });
}

renderTemplate方法可以使用从服务器接收的数据生成HTML标记，并将作为内容转储到窗口内。

更新： renderTemplate方法可以是需要来自akDetail.php调用的数据的kendo模板，也可以是返回HTML标记的自定义实现，可以将其用作模态窗口的内容。例如，

function renderTemplate(dataItem) {
    var markup = $('<div id="details-container"> ' +
                        '<h2 class="firstName"></h2> ' +
                        '<em class="title"></em> ' +
                        '<dl> ' +
                            '<dt class="city"></dt> ' +
                            '<dt class="dob"></dt> ' +
                        '</dl> ' +
                    '</div>');
    markup.find('h2.firstName').html(dataItem.firstName);
    markup.find('em.title').html(dataItem.title);
    markup.find('dt.city').html(dataItem.city);
    markup.find('dt.dob').html(kendo.toString(dataItem.dob, "MM/dd/yyyy"));
}

将数据从kendo网格加载到kendo窗口

1 个答案: