We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Question about Grid's JSON processing capabilities

Thread ID:

Created:

Updated:

Platform:

Replies:

149649 Dec 4,2019 12:58 PM UTC Dec 10,2019 04:53 AM UTC ASP.NET MVC - EJ 2 3
loading
Tags: Grid
CR
Asked On December 4, 2019 12:58 PM UTC

Dear all, 

I have a question about the JSON processing capabilities of the Syncfusion Grid component (EJS / EJ2). I would like to display the contents of a JSON file in the Grid. The JSON file is the result of an API-call. I followed the instructions presented in the documentation, also taking into account this article here in the community forum. I created the following helper method for converting the JSON file:

public static object DeserializeJson(string jsonInput){
if (jsonInput == null) throw new ArgumentNullException(nameof(jsonInput));
var obj = JsonConvert.DeserializeObject<object>(anotherJsonTest);
return obj;
}

The grid is on the Index.cshtml page, using the following code:
   
<div class="grid-view">
            @Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.DataSource).Height(500).Render()
        </div>

After some disappointing errors, I considered using a less intricate JSON file to be passed to both the conversion method and the grid. Using the following sample lead to a proper display of items.

[
  {
    "_id": {
      "$oid": "5968dd23fc13ae04d9000001"
    },
    "product_name": "sildenafil citrate",
    "supplier": "Wisozk Inc",
    "quantity": 261,
    "unit_cost": "$10.47"
  },
  {
    "_id": {
      "$oid": "5968dd23fc13ae04d9000002"
    },
    "product_name": "Mountain Juniperus ashei",
    "supplier": "Keebler-Hilpert",
    "quantity": 292,
    "unit_cost": "$8.74"
  },
  {
    "_id": {
      "$oid": "5968dd23fc13ae04d9000003"
    },
    "product_name": "Dextromathorphan HBr",
    "supplier": "Schmitt-Weissnat",
    "quantity": 211,
    "unit_cost": "$20.53"
  }
]

I know that the grid appears to be working, however, reverting back to actual the JSON file I intended to process in the beginning, nothing was displayed in the grid. I checked the console in the Browser (Google Chrome) for errors and found the following error message:

constants.js:93 Uncaught TypeError: Cannot read property 'matrix' of undefined
    at e.onFocus (constants.js:93)

Considering the above error message, I was wondering if there were processing limitations regarding the complexity (level of dimensions) of the JSON file passed to the grid. What is the exact meaning behind the error message above and how can I avoid this.

Are there any alternatives I could apply to display the information contained in complex JSON files in the grid.

It would be grand if you could provide some insight into this matter.

Thanks a mil in advance. Please do get in touch if you require additional information.

Kind regards
C.

Pavithra Subramaniyam [Syncfusion]
Replied On December 5, 2019 06:22 AM UTC

Hi Chris, 
 
Thanks for contacting us. 
 
We have analyzed your query. While Grid columns are not defined it will autogenerate the columns. You can define columns and enable paging to handle large amount of data without performance degradation. Also we suggest you to bind actionFailure event for the Grid to know the cause of Failure in Grid actions. 
 
Code example: 
 
@Html.EJS().Grid("check").DataSource((IEnumerable<object>)ViewBag.DataSource).AllowPaging().Columns(col => 
{ 
   col.Field("ProductID").HeaderText("Product ID").Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); 
   col.Field("ProductName").HeaderText("Product Name").Width("150").Add(); 
   col.Field("UnitPrice").HeaderText("Supplier ID").Width("130").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); 
   col.Field("UnitsInStock").HeaderText("QuantityPerUnit").Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); 
col.Field("Discontinued").HeaderText("Discontinued").Width("140").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Center).Type("boolean").DisplayAsCheckBox(true).Add(); 
 
}).ActionFailure("actionFailure").Render() 
 
 
<script> 
    function actionFailure(args) { 
        console.log(args); 
    } 
</script> 
 
                             https://ej2.syncfusion.com/aspnetmvc/documentation/grid/paging/#paging 
 
If you still faced the issue, could you please share the json in a text file to validate our end. 
 
Regards, 
Pavithra S. 


CR
Replied On December 9, 2019 02:02 PM UTC

Dear Pavithra, 

Thanks a mil for your reply and your suggestions. I would like to let you know that at least this issue has been resolved. The overall structure of the JSON was changed and simplified (less branches). With the less intricate structure, I managed to display the data contained in the JSON file in the grid view as planned. 

Kind regards

Chris

Pavithra Subramaniyam [Syncfusion]
Replied On December 10, 2019 04:53 AM UTC

Hi Chris, 
 
Thanks for you update. 

We are glad to know that you have managed to display the data. 

Please contact us if you have any concern. 
 
Regards, 
Pavithra S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon