Mass Edit in a Grid

Suite and Optimus Suite 5
#1

Hello -

I understand that with editing enabled, one can edit a given cell in a grid. What we need is some way to change the multiple cells at the same time for a given column for all selected rows to the same value (Mass Update).

For example, rows 1, 3, 5, 7 are selected. We’d like to double-click the column header (or some other mechanism?) to pop open a dialog box where we get the user’s input, then when the user submits the dialog we update the column but only for rows 1,3,5,7.

In addition, we don’t want to have to reload the entire grid - only the rows (or cells) affected. The grid could get quite large, but only a small number of rows might be selected.

Finally, we need to be able to pass the grid back to the server side to allow the user to save the modified contents to the database.

I’m sure dhtmlxGrid has a method or methods that can facilitate this… just not sure which ones and how to get it done.

Can you point me in the right direction?

Thanks

#2

To update cell value you can use setValue() method:

grid.cellById(row_id,cell_index).setValue(“some value”);

where row_id - id of the row
cell_index - zero-based column index

To get selected row’s ids you can use getSelectedRowId() method. In case of multi selection method returns list of ids with default delimiter (comma), e.g:
“row1,row3,row5,row7”

When you change cell value with api, you should mark corresponded row updated manually so DataProcessor will know if it necessary to send request to the server side:

grid.cellById(row_id,cell_index).setValue(“some value”);
dp.setUpdated(row_id,true);

docs.dhtmlx.com/doku.php?id=dhtm … s_errors&s[]=setUpdated

#3

Thank you, Olga!

One other question I forgot to ask. Current design calls for the user to double-click the column header which will fire an event to open an edit window that the user will then fill in the value to be set in all the chosen cells of the column.

Is it possible to trap for a double-click event in the column header, without causing the column to sort?

If not, is it possible for, say, row 0 to contain one type of data (1 button per cell), while rows 1 through n contain the regular data, and then to exclude row 0 from other grid actions such as sorting, etc.? The idea here would be to “fake it” by having a row of buttons, on at the top of each column that the user could click.

Thanks for your help…

#4

Is it possible to trap for a double-click event in the column header, without causing the column to sort?
You can disable sorting in the column with “na” sorting type:
grid.setColSorting(“na,str,int…”)

Now you can add custom container in grid header and attach “ondoubleclik” event to it:

grid.setHeader(“

Column1
,…”);

The idea here would be to “fake it” by having a row of buttons, on at the top of each column that the user could click.
You can attach additional header to the grid attachHeader() method.
Also you can attach almost anything custom content to the grid header (except tables)
Please check tutorial here docs.dhtmlx.com/doku.php?id=dhtm … er_extra&s[]=custom&s[]=header