Simple jQuery SlickGrid JSON example or documentation

问题

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.

回答1:

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>

回答2:

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

回答3:

Take a look at this example.

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

回答4:

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);
}

来源：https://stackoverflow.com/questions/4984167/simple-jquery-slickgrid-json-example-or-documentation

标签

jquery

ajax

json

slickgrid