Sample error

Lapointe

Hi all
In https://editor.datatables.net/examples/inline-editing/fullRow.html clicking on trash then try to close editor do not run, because inline edit started on trash click
just replace

table.on('click', 'tbody td.row-edit', function (e) {

with

table.on('click', 'tbody span.edit', function (e) {

Regards
Bob

Lapointe

In fact my solution is not a solution, because no way to edit record yet. Sorry

Lapointe

nedd to change

table.on('click', 'tbody td.row-edit', function (e) {
    editor.inline(table.cells(this.parentNode, '*').nodes(), {

to

table.on('click', 'tbody span.edit', function (e) {
    editor.inline(table.cells(this.parentElement.parentNode, '*').nodes(), {

allan

Doh - thank you. Fix in git and will be deployed soon.

Allan

Lapointe

Hi @allan
Thank.
On same subject Is there a way when going inline edit mode to hide remove control and when edit done (blur, esc, ret, ...) reshow it ?
I know you will add inline opts like removeHtml and removeTrigger, but waiting for anothrer simple way to hide and show this icon ?

Best regards
Bob

allan

Hi Bob,

If we take this page as an example, do you mean that if you click the pencil for one of the rows, you want to hide the bin icon for deletion while the row is being edited?

There isn't a built in way to do that at the moment, however, what you could do is add a class to the row being edited and then use display: none for a selector that would pick up the bin icon. That class would need to be removed from the row on submitComplete.

Allan

Lapointe

Hi Allan
Thanks for answering.
do you mean that if you click the pencil for one of the rows, you want to hide the bin icon for deletion while the row is being edited?
Yes, because in this sample https://editor.datatables.net/examples/inline-editing/fullRow.html, the remove button can be clicked in place of submit,

In inline mode, we can set some opts, like onBlur, ... and use a fct with editor as single parameter.
submitComplete (or closed) do not directly see removebutton span for the edited row in editor event managment...
So how to addClass to just part of a cell (like span.remove only) in table event onclick button and removeClass on editor event ?

allan

On the example page pop open the console and run:

var table = $('#example').DataTable();
var editor = table.editor();

editor
    .on('initEdit', function () {
        table.rows(editor.ids(true)).nodes().to$().addClass('hide-delete');
    })
    .on('submitComplete', function () {
        table.rows(editor.ids(true)).nodes().to$().removeClass('hide-delete');
    });

You'll be able to see that when a row is edited it has the class hide-delete added. Then in CSS you could use:

tr.hide-delete span.remove {
  display: none;
}

I actually think it is okay to have the delete icon still shown while in edit mode. I think triggering an edit and then deciding that actually you want to delete the row is a valid thing to do, but I totally understand that you might want to present the UI a little differently.

Allan

Lapointe

Thank.
You are always the #1 in team...
Bob