Convert XLSX to JSON
Read an .xlsx file and get a JSON document back — without uploading anything. ReoGrid parses the file in the browser, then toJson() serializes the full workbook (all sheets, styles, formulas) to a lossless ReoGrid JSON document.
Full example
import { createReogrid } from '@reogrid/pro';
const grid = createReogrid('#grid', { licenseKey: 'YOUR-LICENSE-KEY' });
const input = document.querySelector<HTMLInputElement>('#file')!;
input.addEventListener('change', async (e) => {
const file = (e.target as HTMLInputElement).files?.[0];
if (!file) return;
await grid.loadFromFile(file); // parse + render the .xlsx
const doc = grid.toJson(); // whole workbook → ReoGrid JSON
const json = JSON.stringify(doc, null, 2);
console.log(json);
// ...copy to clipboard, download, or POST to your API
});
<input type="file" accept=".xlsx" id="file" />
<div id="grid" style="width: 100%; height: 400px;"></div>
Download the JSON
function downloadJson(doc: unknown, filename = 'workbook.json') {
const blob = new Blob([JSON.stringify(doc, null, 2)], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const a = Object.assign(document.createElement('a'), { href: url, download: filename });
a.click();
URL.revokeObjectURL(url);
}
await grid.loadFromFile(file);
downloadJson(grid.toJson(), file.name.replace(/\.xlsx$/i, '.json'));
Single sheet only
To serialize just the active worksheet (not the whole workbook), use the worksheet-level writer:
import { stringifyReoGridJson } from '@reogrid/pro';
await grid.loadFromFile(file);
const json = stringifyReoGridJson(grid.worksheet, { pretty: true });
Restore it later
const saved = localStorage.getItem('workbook');
if (saved) grid.loadJson(JSON.parse(saved));
Notes
- Lossless. ReoGrid JSON keeps everything xlsx round-trips plus ReoGrid-only features (custom cell types, all conditional-format rules). It is the format to use for save/restore.
- Need plain rows of data (
[{ name, price }, …]) instead of the full document? See Convert XLSX to data rows. - Lite vs Pro. xlsx import works in Lite too, but Lite truncates files past 100 rows × 26 columns. Convert real-world files with Pro.
- Everything runs client-side — the file never leaves the browser.