Dojo Editing Multiple Dgrid Cells

Can I edit multiple dgrid cells at the same time?

I know that we can edit one cell at a time by double-clicking on one cell and update it. And in onBlur this cell, the edited data is updated for this cell.

But my requirement is:

  • click edit-link / edit-button for each row that displays editors for all editable cells of that row,
  • update / change cells
  • then click the save button (which will be next to the edit button) for the same line,
  • when you click on the "Save Link /" icon, the edited cell value must be saved in the repository / server.

Below are some of the grid columns.

 // one of the editable columns others are also similar to this one.. editor({ label:"Outcome", field:"outcome", sortable: false, editorArgs: { options:[ {value: "1", label: "Opt1"}, {value: "2", label: "Opt2"}, {value: "3", label: "Opt3"}, ] }, renderCell: function(row, value, td, options){ put(td, "div", outcomeOptionsMap[value] || ''); } }, Select, "dblclick" ), // last column {label:"Actions", field:"actions",sortable: false, renderCell: function(row, value, td, options){ newValue = "<a href=\"#\" title=\"Edit\" onclick='editEntireRow(testgrid,event);'><img src='../static/images/edit.gif'/></a>"; newValue = "<a href=\"#\" title=\"Save\" onclick='saveRow(testgrid,event);'><img src='../static/images/edit.gif'/></a>"; newValue += " <a href=\"#\" title=\"Delete\" onclick='testgrid.store.remove("+row.id+");'><img src='../static/images/delete_icon.png'/></a>"; td.innerHTML = newValue; } 

By the way, I use dojo.store.JsonRest as a store.
Grid declaration

 var MyGrid = declare([Grid, Selection, Keyboard]); window.testgrid = new MyGrid( { store : Observable(Cache(jsonRest, Memory())), selectionMode : "none", getBeforePut: false, columns: getColumns, allowSelectAll: true, minRowsPerPage: 5, maxRowsPerPage: 20, }, "gridContainer"); 

I'm currently trying something like this, but not working ...

 function editEntireRow(grid,event){ // cols 3,5,7,8 steps to the left of the Action column are editable grid.edit(grid.left(grid.cell(event),3)); grid.edit(grid.left(grid.cell(event),5)); grid.edit(grid.left(grid.cell(event),7)); //grid.edit(grid.left(grid.cell(event),8)); } 
+4
source share

Source: https://habr.com/ru/post/1441504/


All Articles