Rocket Modern Experience (formerly LegaSuite)

 View Only

 Load JSON data into the grid mapping each key to each column in the grid

VitheyaMonikha K J's profile image
VitheyaMonikha K J posted 07-15-2024 08:23

Hi,

I have a JSON data and I am trying to load it in the Grid, but the entire JSON is appending only in the 1st column. I need each key in the JSON to be mapped to separate column. can someone provide me with a solution? I have attached the attachment for your reference..

Thanks,
VitheyaMonikha K J
Roger Van Valen's profile image
Roger Van Valen

Hi VitheyaMonikha,

I am not sure about the use case, but the following might work for you:

Create a structure to contain the data you'd like to present in a grid. For instance:

Structure PersonInfoStruct
	dim name as string
	dim phone as string
	dim email as string
	dim address as string
	dim city as string
	dim postalZip as string
	dim country as string
	dim dob as string
	dim currency1 as string alias "currency"
	dim salary as integer 
	dim selected as string
	dim mugshot as string
End Structure

An array of these structures can be used to populate the grid. I've created this global variable for an array of elements of this structure:

Global persons() as PersonInfoStruct

The HostField of a grid column can then be set to this global variable element, for instance:

&&Persons().name, &&Persons().email, and so forth

As example I've used JSON data generated with mock data generator, in the following form:

[{
        "name": "Moses Bason",
        "phone": "543-668-4597",
        "email": "mbason0@theatlantic.com",
        "address": "0258 Forest Terrace",
        "city": "Kilju",
        "postalZip": null,
        "country": "North Korea",
        "dob": "1980-10-27",
        "currency": "$47.82",
        "salary": 2646
    }, {
        "name": "Halimeda Huggens",
        "phone": "133-368-8447",
        "email": "hhuggens1@360.cn",
        "address": "611 Blackbird Road",
        "city": "El Cuy",
        "postalZip": "8333",
        "country": "Argentina",
        "dob": "1920-07-22",
        "currency": "$56.96",
        "salary": 4439
    }
]

This small script example will read the JSON file, populate the global variable with all the items in the list, and refreshes the page at the end.
This will update the grid.

/* import the file system api for file handling */
import * as fs from 'mx:fs';

// Just a small example to read some person data to a global variable
let fullpath = script.environment.pckgdir + 'Resources/Data/exampledata.json';
let file_contents = fs.readTextFile(fullpath);
let imported_persons = JSON.parse(file_contents);
let itemlist = [];
imported_persons.forEach((p) => {
	let item = new script.structure.PersonInfoStruct(p);
	itemlist.push(item);
});
script.global.persons = itemlist;

Page.update();  


This is just an example, depending on your use case there could be better / neater ways to populate the grid.

Hope this helps,

Regards,

Roger van Valen.