inline editing with (Parent / child editing in child rows)

Khalid Teli

Hi,
Am I right to say that inline editing doesn't go well or doesn't work well with parent/child editing structure in this example: https://datatables.net/blog/2019-01-11

For example, if you click on the child table row td , will the inline editor confuse between the td of parent table and child table?

In the case below, when you click on thetbody of child table, which actually is embedded inside parent table? How will thetd be differentiated?

   $('#income').on( 'click', 'tbody td:not(:nth-child(1), :nth-child(2))', function (e) {
        incomeEditor.inline( this, {
            submit: 'allIfChanged'
        } );
    } );

so it is better to use basic Editor installation for this example?

Thank you

colin

I haven't tried this, but I think it should be OK. In the blog post example, it's a bit trickier than this example, as the blog post can have multiple child tables open whereas the example doesn't.

In the blog post, inside the createChild() function, you can add the inline editing for the child table, something like this:

table.on('click', 'td', function() {
     usersEditor.inline( this, {
         submit: 'allIfChanged'
     } );
});

Doing it there ensures the Editor object is correct for each table.

For the parent, you can check and see if there is a single parent table, something like this:

$('#sites').on('click', 'td', function() {
    if ( $(this).parents('table').length === 1) {
         usersEditor.inline( this, {
             submit: 'allIfChanged'
         } );
    }
});

I think that should do the trick,

Colin

Khalid Teli

@collin Thank you

using this if ( $(this).parents('table').length === 1) {for the parent tables did the trick.

Thank you