Добавить уникальный идентификатор в каждую строку, используя ag-Grid

Question

Я использовал плагин ag-Grid в javascript для своей сетки.Моя проблема - выяснить, как я могу обновить строки в базе данных.Как я могу установить уникальный идентификатор для каждой строки?

<div id="myGrid" style="height: 600px;" class="ag-theme-balham"></div>

    <script type="text/javascript" charset="utf-8">
        // specify the columns
        var columnDefs = [
            {headerName: "Make", field: "make"},
            {headerName: "Model", field: "model"},
            {headerName: "Price", field: "price"}
        ];

        // specify the data
        var rowData = [
            {make: "Toyota", model: "Celica", price: 'test', my_unique_id: '123'},
            {make: "Ford", model: "Mondeo", price: 32000, my_unique_id: '42341'},
            {make: "Porsche", model: "Boxter", price: 72000, my_unique_id: '567'}
        ];

        // let the grid know which columns and what data to use
        var gridOptions = {
            columnDefs: columnDefs,
            rowData: rowData
        };

        // lookup the container we want the Grid to use
        var eGridDiv = document.querySelector('#myGrid');

        // create the grid passing in the div to use together with the columns & data we want to use
        new agGrid.Grid(eGridDiv, gridOptions);
    </script>

Answer 1

Я не уверен, что вам известно об этом, но ag-grid фактически назначает уникальный идентификатор каждой строке, когда заданы данные строки.

Один из способов доступа к idдля каждого узла строки следует использовать метод forEachNode(), как указано в документации ag-grid gridOptions API .forEachNode() повторяет все строки и возвращает данные для каждой строки.

Предполагая, что вы используете Vanilla JavaScript (без каких-либо каркасов, таких как React или Angular), вы получаете следующее для получения id

 gridOptions.api.forEachNode(node => {
   console.log(node.id);
   // do the rest
 });

Answer 2

В определении ваших столбцов columnDefs вам нужно добавить ключ и, если вам нужно, установить hide: true, чтобы эти данные не отображались в интерфейсе пользователя

 var columnDefs = [
            {headerName: "Make", field: "make"},
            {headerName: "Model", field: "model"},
            {headerName: "Price", field: "price"}, 
            {headerName: "Key", field: "my_unique_id", hide = true}, 
 ];

См. Все свойства для столбцов в ag-grid документах здесь: https://www.ag -grid.com / javascript-grid-column-properties /