简单的 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数据网格,它还包括多个样式主题
求助,怎么通过js获取slickgrid表格中的行数,选中行和一行中的数据