简单的 jQuery SlickGrid JSON 示例或文档

Posted

技术标签:

【中文标题】简单的 jQuery SlickGrid JSON 示例或文档【英文标题】:Simple jQuery SlickGrid JSON example or documentation 【发布时间】:2011-06-26 10:21:00 【问题描述】:

我正在寻找一个简单的示例,说明在尝试通过 jQuery.Ajax 以 JSon 形式检索数据时如何使用 SlickGrid。 我也找不到 SlickGrid 插件的任何文档,并且想知道我是否只是在错误的地方寻找。 任何帮助我开始使用 SlickGrid 的帮助将不胜感激。

【问题讨论】:

【参考方案1】:

看看这个example。

如果 SlickGrid 缺少示例,请查看 jqgrid。

【讨论】:

不幸的是,这个例子对于初学者来说已经相当复杂并且难以理解。例如,我将如何在 $.Ajax 调用中实现成功回调?有没有可用的文件?谢谢! SlickGrid 是否有任何类型的文档? 文档目前有点缺乏,但有大量示例展示了使用 SlickGrid 的最有效方法。 Google 网上论坛有一个支持小组。【参考方案2】:

SlickGrid 存储库中的 AJAX 示例非常复杂,因为它试图在缓存等方面变得棘手。例如,它跟踪所有已发送的行,并且只会从服务器请求新行。对于 Digg 故事的特定示例,它也进行了硬编码。文档非常缺乏,而且 jQuery 1.5+ 版本似乎有问题(它改变了 ajax 的处理方式)。

使用 SlickGrid 的 Andrew Childs fork 让我更容易上手,它在 README 的底部包含关于如何使用 AJAX 的非常简单直接的说明:

存储库位于https://github.com/andrewchilds/SlickGrid

【讨论】:

【参考方案3】:

asp.net 页面中的示例。 webservicemyData返回一个需要匹配网格列的json字符串。

$(function () 

        $.ajax(
            url: "WS.asmx/myData",
            global: false,
            type: "POST",
            data: "",
            contentType: "application/json",
            dataType: "json",
            async: false,
            success: function (json) 
                data = eval('(' + json.d + ')');
                if (!data)  alert('no data'); ;
            ,
            error: function (msg) 
                var errorText = eval('(' + msg.responseText + ')');
                alert('Error : \n--------\n' + errorText.Message);
            
        

        );

 if (data) 
    dataView = new GridNic.Data.DataView();
    grid = new GridNic.Grid($("#myGrid"), dataView.rows, columns, options);
    var pager = new GridNic.Controls.Pager(dataView, grid, $("#pager"), columns);
    var columnpicker = new GridNic.Controls.ColumnPicker(columns, grid, options);

...等等


在 Asp.Net 中,json 字符串的大小默认是有限制的。如果出现问题,您必须在 web.config 中声明更大的尺寸,例如:

<system.web.extensions>
  <scripting>
    <webServices>
        <jsonSerialization maxJsonLength="5000000">
        </jsonSerialization>
    </webServices>
  </scripting>
</system.web.extensions>

【讨论】:

【参考方案4】:

解决方案很简单,但他们没有在他们的 wiki 页面上明确说明如何做到这一点。

SlickGrid 期望 JSON 为对象形式。因此,如果出于任何原因它是字符串形式,只需使用:

JSON.parse(jsonString);

如果您从 ajax 加载,只需执行以下操作:

$.getJSON("file.json", function(data) 
    grid = new Slick.Grid("#myGrid", data, columns, options);

【讨论】:

以上是关于简单的 jQuery SlickGrid JSON 示例或文档的主要内容,如果未能解决你的问题,请参考以下文章

SlickGrid:使用 DataView 而不是原始数据的简单示例?

Angular Slickgrid是迅雷不及掩耳之势的包装;可自定义的SlickGrid数据网格,它还包括多个样式主题

在 SlickGrid 中是不是可以使用可变行高?

求助,怎么通过js获取slickgrid表格中的行数,选中行和一行中的数据

jquery.event.drag 和 jquery 可调整大小不兼容

SlickGrid RemoteModel 与 Dataview 模型