Datatable Editor inlineCreate Persistence/Sticky/Fixed with Conditional onBlur
Datatable Editor inlineCreate Persistence/Sticky/Fixed with Conditional onBlur

Link to test case:
https://editor.datatables.net/examples/inline-editing/fullRowCreate.html
Description of problem:
I am modifiying the above demo to have a persistent inlineCreate('end')
with a conditional onBlur
to only close when editing another row. Setting onBlur : 'none'
in the inline formOptions prevents existing rows inline editor to activate after clicking the edit row button. Any suggestions or different approaches to achieve this? What's the best way to check if the onBlur event is from clicking the edit row button? It is a small table of under 10 rows with no paging. The first inlineCreate('end')
is called at initComplete of the Datatable. Thanks.
var editor = new DataTable.Editor({
ajax: '../php/staff.php',
fields: [
{
label: 'First name:',
name: 'first_name'
},
{
label: 'Last name:',
name: 'last_name'
},
{
label: 'Position:',
name: 'position'
},
{
label: 'Office:',
name: 'office'
},
{
label: 'Extension:',
name: 'extn'
},
{
label: 'Start date:',
name: 'start_date',
type: 'datetime'
},
{
label: 'Salary:',
name: 'salary'
}
],
formOptions: {
inline: {
//onBlur: "none", //currently preventing editing an existing row
onBlur: function (e) {
if ($(e.relatedTarget).closest('span').hasClass('edit')) {
return 'close';
} else {
return 'none';
}
},
onComplete: function () {
editor.inlineCreate('end');
},
onCancel: function() {
editor.inlineCreate('end');
}
}
},
table: '#example'
});
Answers
That's a good question - I'm not sure that there is a better way of doing this at the moment I'm afraid. I'll need to have a bit of a deep think about this!
Allan