简单的 jQuery SlickGrid JSON 示例或文档

发布于 2024-10-17 10:42:06 字数 141 浏览 6 评论 0原文

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

I'm looking for a simple example on how to use SlickGrid when trying to retrieve the data as JSon via jQuery.Ajax.
I was also unable to find any documentation of the SlickGrid plugin and was wondering if I was just looking in the wrong places.
Any help to get me started with SlickGrid would be most appreciated.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

吲‖鸣 2024-10-24 10:42:06

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

通过使用 SlickGrid 的 Andrew Childs 分支,我可以更轻松地开始使用,其中在自述文件底部包含有关如何使用 AJAX 的非常简单明了的说明:

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

The AJAX example in the SlickGrid repository is quite complex, because it's trying to get tricky with caching, etc. For example, it keeps track of all the rows already sent and will only request new rows from the server. It's also hard coded for the specific example of Digg stories. Documentation is sorely lacking and it seems buggy with the versions 1.5+ of jQuery (which changed how ajax was handled).

I had much easier time getting started by using Andrew Childs fork of SlickGrid, which contains very simple and straightforward instructions on how to use AJAX at the bottom of the README:

The repository is at https://github.com/andrewchilds/SlickGrid

断桥再见 2024-10-24 10:42:06

asp.net 页面中的示例。 Web 服务 myData 返回需要匹配网格列的 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>

An example within an asp.net page. The webservice myData returns a json string that needs to match the grid columns.

$(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);

... and so on


In Asp.Net, the size of the json string is restricted by default. In case of trouble you have to declare a larger size in the web.config e.g. :

<system.web.extensions>
  <scripting>
    <webServices>
        <jsonSerialization maxJsonLength="5000000">
        </jsonSerialization>
    </webServices>
  </scripting>
</system.web.extensions>
北城孤痞 2024-10-24 10:42:06

看一下这个示例

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

Take a look at this example.

If SlickGrid lacks of examples, take a look at jqgrid.

风蛊 2024-10-24 10:42:06

解决方案很简单,但他们没有在 wiki 页面上明确说明如何执行此操作。

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

JSON.parse(jsonString);

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

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

The solution is simple, but they do not explicitly state how to do this on their wiki page.

SlickGrid expects JSON to be in object form. So if for any reason it is in string form just use:

JSON.parse(jsonString);

If you're loading from ajax, just simply do this:

$.getJSON("file.json", function(data) {
    grid = new Slick.Grid("#myGrid", data, columns, options);
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文