CODEWITHSUNDEEP
reactjsag-gridag-grid-react
nino
nino

Reputation: 861

useRef to create a cellEditor in ag-grid in React

I have a questions on how to use the useRef Hook in React combined with the ag-grid component to create a persisent cellEditor. In the following Github example, there is an example on how to access the new value after the user has edited the field in the ag-grid:


export default forwardRef((props, ref) => {
    const inputRef = useRef();
    useImperativeHandle(ref, () => {
        return {
            getValue: () => {
                return inputRef.current.value;
            }
        };
    });

    useEffect(() => {
        // https://github.com/facebook/react/issues/7835#issuecomment-395504863
        setTimeout(() => inputRef.current.focus(), 10)
    }, []);
    return <input type="text" ref={inputRef} defaultValue={props.value}/>;
})

What I don't understand is how I can find out which row and field i am editing. Could someone point me towards what I am missing?

Upvotes: 0

Views: 1298

Answers (1)

blu
blu

Reputation: 372

The grid refresh api provides the interface for working with cells. The props param has everything you need.

https://www.ag-grid.com/javascript-grid-refresh/#refresh-cells

interface RefreshCellsParams {
    rowNodes?: RowNode[]; // specify rows, or all rows by default
    columns?: (string|Column)[]; // specify columns, or all columns by default
    force?: boolean; // skips change detection, refresh everything
}

Upvotes: 1

Related Questions