ASP.Net - How do I bind Syncfusion ejGrid using a json result via an ajax call

[Stephen Harris]

I am returning what looks like a JSon string back to the success section of a JavaScript function but I can't bind it to the ejGrid. It displays an empty grid no matter what I do.

The Ajax call is below.   I think that binding the jsonResults string to a datamanager using a json adapter might do the job. I can't see examples of this anywhere. I have tried several approaches with no success.

            $.ajax(

            {

                contentType: "application/json; charset=utf-8",

                type: "GET",

                datatype: "JSON",

                data: records,

                success: function (jsonResults) {

                   // var e = x;

                  //  var data1 = ej.DataManager(jsonResults.result).executeQuery(new ej.Query());

                    alert(JSON.stringify(jsonResults));

                    var gridObj = $("#GridDynamic").ejGrid("instance");

                    gridObj.dataSource(JSON.stringify(jsonResults));

                },

                error: function (jsonResults) {

                    alert("Error");

                }

            });

In the above, my API controller method is returning a PageResult because this works when I am using this method for an ej.WebApiAdaptor() that populates the same grid. I can't use this for the above example because I am multi-selecting  data in the grid after initially populating it using the ej.WebApiAdaptor().  With the multi-select I am obtaining the Id values to get the next set of data to return to the grid.  Once I have determined the he Id values I use the below to return the result.  The selected data is accurate.  Its rendering it in the grid that is the problem.

                    IEnumerable<ACRArchive> selection  = GetSelectedArchives();

                    var jsonSelection = JsonConvert.SerializeObject(selection);

                    jsonResults = serializer.Deserialize<IEnumerable<ACRArchive>>(jsonSelection);

                    count = selection.Count();

                    return new PageResult<ACRArchive>(jsonResults, null, count);

[Venkatesh Ayothi Raman]

Hi Stephen, 

Thank you for contacting Syncfusion support. 

We went through your code example that you have shared for us and found that you are using jsonResults.result in success function. But jsonResults object doesn’t have a property of result. So, we suspect that this is the cause of this issue. 

And also you are binding the Grid data source like “gridObj.dataSource(JSON.stringify(jsonResults));” this is not a recommended way. We can bound the Grid data source as object and as well as created a sample for your convenience. Please refer to the code example and sample, 

Code example: 

 

<Grid> 

@(Html.EJ().Grid<object>("Grid") 

             

 //intially we didn't bind the datasource for Grid 

             

              .AllowPaging() 

              .AllowSorting() 

              .PageSettings(page => { page.PageSize(8); }) 

              . . . 

                   }) 

              .Columns(col => 

              { 

                  . . . 

              }) 

    ) 

<AJAX> 

<script type="text/javascript"> 

 

    $.ajax({ 

 

        url: "/api/Orders", // call the wepapi controller  

        contentType: "application/json; charset=utf-8", 

        type: "GET", 

        datatype: "JSON", 

 

        success: function (jsonResults) { 

            var gridObj = $("#Grid").ejGrid("instance");//Grid instance 

            gridObj.dataSource(jsonResults.Items); // bound the Grid dataSource. here we should bound the array of objects as datasource not a string and this is a recommended way 

        }, 

        error: function (jsonResults) { 

            alert("Error"); 

        } 

 

    }); 

</script> 

Sample:http://www.syncfusion.com/downloads/support/directtrac/general/7z/WebApiSample_Modified-2038858950 

If we misunderstood your query, then could you please share the more details about your requirement? 

Regards, 

Venkatesh Ayothiraman.