Bind Kendo Grid to jQuery Ajax

I was recently tasked with populating a Kendo UI Grid with data acquired from an AJAX call in jQuery. This can be done directly by actually making the AJAX call within the grid's datasource setting.

All you need to do is reference the grid you've created and point it to the AJAX post as follows. The 'myParameters' variable is an array of parameters being used in the AJAX call:

chartArea.find(".reportGrid").kendoGrid({
dataSource: { 
        type: "json",
        transport: { 
            read: function (options) { 
                $.ajax({ 
                    type: "POST", 
                    url: "http://urlGoesHere", 
                    data: JSON.stringify(myParameters),
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
success: function (data) { options.success(data); } }); } } } });

You may need to adjust this depending on your own requirements, but this worked under my circumstances.

Comments (0)