如何使用 AJAX 为 Dojo Dgrid Table 加载数据？答案

【问题标题】：How do I load data for Dojo Dgrid Table using AJAX?如何使用 AJAX 为 Dojo Dgrid Table 加载数据？
【发布时间】：2013-08-21 12:08:05
【问题描述】：

我正在探索将 DGrid 用于我的 Web 应用程序。我试图有一个类似于this 的表。上面示例的代码是here。

该表使用内存存储作为其数据源 - 当我们单击并展开每一行时会显示汇总字段。

我希望在单击该行时从服务器获取详细信息（即单击一行时显示的文本），而不是与页面的其余部分一起静态加载。如何修改上面的代码才能做到这一点？

（我的要求是一个 HTML 表格，每一行在点击时都可以展开，每个展开的数据都是从服务器获取的，例如使用 AJAX。我只是在探索 dgrid 作为一个选项，因为我得到了可排序的列免费使用 dgrid。如果有更好的选择，请告诉我）

编辑：基本上我正在寻找这样做的想法，而不是期望任何人真正给我代码。由于对 Dojo 比较陌生，我不确定什么是正确的方法

【问题讨论】：

标签： javascript ajax dojo dgrid

【解决方案1】：

如果您的 ajax 调用返回 html，您可以在渲染器中放置 dijit/layout/ContentPane，并在 ContentPane 的 href 属性中设置要获取的内容的 url。假设您的初始数据（相当于示例的内存存储）将具有一个名为“yourServiceCallHref”的属性，其中包含您要延迟加载的 url，您可以尝试以下操作：

require(["dijit/layout/ContentPane", ...], function(ContentPane){

    renderers = {
        ...,
        table: function(obj, options){
            var div = put("div.collapsed", Grid.prototype.renderRow.apply(this, arguments)),
                cp = new ContentPane({
                    href : obj.yourServiceCallHref
                }),                       
                expando = put(div, "div.expando", cp.domNode);
                cp.startup();
        return div;
    }
});

如果您的服务返回 json，您可能会以类似的方式对 dojo/request 执行某些操作。只需在您的请求回调中添加您的 dom 创建步骤并将它们放在名为“expando”的 div 中...

另一种选择是将内存存储替换为JsonRest 存储，并让服务器输出与您在内存存储上看到的相同的 json 格式。这意味着所有数据都将在一次调用中获取...

【讨论】：

太完美了！谢谢。我不知道存在 ContentPane 之类的东西！