Inline edit breaks when switching between tabs

ztaylor1990

I am using datatables inline edit with tablinks. When I switch between tabs, from the default tab with the inline edit table to a new tab and then back to the default tab the editor stops working. In the console I get the following error. "Uncaught Cannot edit more than one field inline at a time". How can I fix this issue? I can not find any documentation online where someone is having the same issue.

I am creating and destroying the datatables like this on the onclick for my tabs. The tables reinitialize just fine, except the inline edit no longer works until I refresh the page.
rfpworking();$('#rfphistory').dataTable().fnDestroy();rfphistory();

colin

Hi @ztaylor1990 ,

I suspect you would need to also destroy() the Editor instance when you recreate the tables. If that doesn't work, are you able to link to your page?

Cheers,

Colin

ztaylor1990

My page requires a login and is on my companies server. This is my default tab where the inline edit is working.
As soon as I switch tabs and then switch back to my default the inline edit no longer works and I receive this message. Uncaught Cannot edit more than one field inline at a time

I tried the destroy (editor.destroy();) but then I get the following error. Cannot read property 'destroy' of undefined

I believe this is the part of the datatable that is not working correct?

So I am not sure where I am supposed to destroy the editor and furthermore how do I reinitialize it?

colin

It sounds like you're holding open an edit one switching tabs, but without seeing the problem, it's really shooting in the dark. I appreciate you can't give access to your site, but could you create a simplified test case (maybe based on this) that demonstrates the issue?

ztaylor1990

I found the problem when troubleshooting the live.datatable link with my project.

I had my function inside the inline edit call.
// Activate an inline edit on click of a table cell
$('#rfpworking').on( 'click', 'tbody td', function (e) {
editor.inline(rfpworking.cell( this ).index(), {
onBlur: 'submit',

    } );
} );

I removed it and it works just fine now.
// Activate an inline edit on click of a table cell
$('#rfpworking').on( 'click', 'tbody td', function (e) {
editor.inline( this ).index(), {
onBlur: 'submit',
} ;
} );

Thanks

ztaylor1990

Correction to the above comment this is what fixed my issue..
// Activate an inline edit on click of a table cell
$('#rfpworking').on( 'click', 'tbody td', function (e) {
editor.inline(this), {
onBlur: 'submit',
} ;
} );