Virtual scrollingWeb Worker offloadColumnar encodingServer-side dataServer-side grouping & exportRows pushed by the serverPaginationNumbered page buttonsInfinite scrollTransactionsAsync transactionsCell span / mergeColumn spanSortingAutomatic columnsCustom sort orderSort by magnitudeClick cycle per columnLarge integers (BigInt)Row animationReorder after sortingCalculated columnsColumns your users calculateResizingReorderingPinningAuto-size, fit & flexVisibility & chooserRename columns in the gridBands (multi-level headers)Wrapped header textFilter rowHeader filter popupQuick searchFilter panel barRelative date filtersYour own filter UIFind without filteringExternal filterYour own filter operatorsMulti filterFilter builderGrouping (one level)Group panelGroup columnSticky group headersMulti-level groupingGroup summariesEdit a group totalMaster-detailTree dataFooter column totalsTotals row placementCustom aggregationSelection statisticsRow selectionFocused rowDeferred selectionUnselectable rowsRange selectionColumn selection from the headerCell focus & keyboardCopyFill handleClipboard callbacksCut & pasteCell editingParse and write valuesCell formulasBatch editingRow editingForm editingPopup editingValidationPermissionsCustom editors & lookupsCRUD handlersUndo / redoCSV exportExcel exportFormulas & links in exportsPDF exportStyled exportImport wizardThemes & palettesDensityCards on narrow screensLocalizationTooltipsRow numbersCell flashPinned rowsPin rows from the menuRow drag & dropSparklinesCell notesPrint layoutAligned gridsLoading & empty overlaysStatus barSide bar & tool panelsYour own side bar panelsChart data hookChart panelChart API, events & saved chartsBox plotWaterfall, funnel, treemap, heatmap & rangeScatter & bubble chartsChart titles, labels & legendStacked & 100% chartsCross-filter & zoomChart exportEventsImperative APIGrid state for AI modelsSaved viewsContext menusSSR & bundlers
Parse and write values
FreeTurn what the user typed into your value (“1,5” → 1.5), and write it your own way — nested objects, immutable stores.
Try it: Edit a SKU and type it in lower case with spaces: the parser stores it trimmed and in capitals.
Loading DataGrid…
About this DataGrid demo: Parse and write values
Turn what the user typed into your value (“1,5” → 1.5), and write it your own way — nested objects, immutable stores.
Parse and write values is in the free Community edition (@kanunilabs/datagrid-react or @kanunilabs/datagrid): no licence key, no watermark, commercial use included. The grid above is the real component, not a recording — change it and the result is what your users get.
Guide: Parse and write values →
More in Editing
- Cell editing — Edit one cell at a time, committed on blur or Enter.
- Cell formulas — Type =A1*B2 into a cell: references stay on their cells through sorting and filtering, and the fill handle moves them.
- Batch editing — Collect changes and save them together.
- Row editing — Edit a whole row with save/cancel controls.
- Form editing — Edit the record as a form laid out in the row flow.
- Popup editing — Edit the record in a dialog over the grid.