In order to import JSON (or an array of objects), simply change the data input to [{ key: value }, ... ]. Grid.js expects each column to have a unique id field which matches the keys in the data object. id field accepts a function as well. If you have a complex JSON object, pass a function to id and try to refine and format your data. Tip - Grid.js tries to guess the id of columns by camelCasing them if column ID is not defined. E.g. Phone Number becomes phoneNumber.

Using the handler callback you can parse and handle HTTP calls yourself. The default handler tries to cast the response to a JSON format, but you can override it to parse the data in a different format. In this example, we are our demo.xml file which is a XML formatted document. We also enabled all core plugins in this example: sort, search and pagination.

The data attribute accepts an async function, too. This is useful for making any external HTTP calls and loading data from a server. Here we have passed a function to the data attribute which returns a Promise object and resolves the data after 1 second.