Disable editing on all rows except one
Disable editing on all rows except one
Pierre-Louis
Posts: 10Questions: 3Answers: 0
Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem:
Hi, I have an issue disabling editing on rows.
Based on this discussions: https://www.datatables.net/forums/discussion/66810/how-to-edit-all-rows-except-one, i came up with this
My code looks like this:
semainierTableEditor.on('edit', function (e, node, data, items) {
console.log("e", e, "node", node, "data", data, "items", items)
//semainierTableEditor.disable();
let indexes = semainierTable.rows().indexes();
//let rowIdx = semainierTable.rows({ selected: false }).indexes();
let pos = indexes.indexOf(selectedRowIndex);
indexes.splice(pos, 1);
console.log("indexes", indexes, "rowidx", selectedRowIndex, "pos", pos, "rowidx", rowIdx);
semainierTableEditor.edit(indexes, false);
console.log("indexes", indexes);
});
When the user edit a row, i'm supposed to make all other rows on read.
The first problem i've encountered was retrieving the index of the selected row.
While this wasn't working:
//let rowIdx = semainierTable.rows({ selected: false }).indexes(); and always returning me the indexes without the 0 (and always the 0),
i went for a global variable:
$('#semainierTable tbody').on('click', 'tr', function () {
var row = semainierTable.row($(this));
console.log("selected row", row.data(), "index", row.index())
selectedRowIndex = row.index();
This way, i could retrieve the correct index of the selected row.
The thing is that this line of code doesn't disable the other rows:
semainierTableEditor.edit(indexes, false);
What am i doing wrong ?
Regards
Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.
Replies
Hi,
I'm not actually quite clear on what the goal is here.
edithappens after the row has been submitted for editing. So based on that it sounds like any row would be editable and then once the user has picked one, none of the others should be editable? Is that correct? Or do you have some other logic in mind for how to select which row should be editable?Allan
Yes exactly, every row is editable until one is edited. Then none is editable until the users saves the changes made.
I'd probably do something like:
Allan
Is there a way to do an inline editing instead of the editor.edit(this) ?
And also the popup is blank
Not sure if it's an initialization problem ?
`semainierTable = $('#semainierTable').DataTable({
paging: false,
ordering: false,
scrollY: '60vh',
scrollCollapse: true,
info: false,
autoWidth: false,
order: [[14, "asc"]],
columnDefs: [
{
targets: [10, 11, 12, 13, 14, 15, 16, 17,
18, 19, 20, 21, 22, 23, 24, 25, 26, 27,
28, 29, 30, 31, 32, 33, 34, 35, 36, 37,
38, 39, 40, 41, 42, 43, 44, 45, 46],
visible: false,
searchable: false
},
{
targets: 0,
width: "1%",
},
{
targets: 1,
width: "35%",
},
{
targets: 2,
width: "2%",
},
{
targets: 3,
width: "5%",
},
{
targets: 4,
width: "5%",
editField: "QteProd",
data: "QteProd",
name: "QteProd"
},
{
targets: 5,
width: "2%",
},
{
targets: 6,
width: "5%",
editField: "QteConfirme",
data: "QteConfirme",
name: "QteConfirme"
},
{
targets: 7,
width: "5%",
},
{
targets: 8,
width: "3%",
},
{
targets: 9,
width: "8%",
},
{
targets: 15,
name: "IdAn",
data: "IdAn"
}
],
"initComplete": function (settings, json) {
//$("#semainier").DataTable().rows().every(function (rowIdx, tableLoop, rowLoop, data) {
// console.log(this.data().designationMarquage);
// var tr = $(this.node());
// this.child(format(this.data())).show();
// tr.addClass('shown');
//});
}
});
Regards
Sure - rather than calling
edit()callinline(). See the full list of inline editing examples here.Allan
Great, thank you Allan