Strange OnReturn behaviour

Andy Read

Hi
Not sure if I've missed something here but I have come across an anomoly which has left me a bit stumped.
I have been using DataTables for a long time now and it is indeed a fantastic framework, thank you! I've recently started to add some limited Editor functions.
See here for test case: http://rapid.prismbrainmapping.com/draft/datatables

If I click 'Edit' on a record, I get the 'edit' form. If I click the 'Save' button, I get the custom action that is set on the .edit API call. Also, if I click 'Delete' on a record, I get the 'remove' form. If I then click on the 'Delete' button, the record disappears from my table and I get the custom action that is set on the .remove API call. No actual editing or deleting takes place but I have ensured that my MVC controller is passing back the correct data in JSON format. All good so far!

Now, if I open the 'Edit' form again, make a change on the form, and just hit the Return button, the form disappears (after the edit) but no custom function is run, as expected from you documentation about the onReturn formoption - https://editor.datatables.net/reference/type/form-options#onReturn---Action-to-take-on-return-key-when-the-form-is-focused
Again, all good so far.

However, if I open the 'Delete' form again, and just hit the Return button, the following odd things happen:
If using Chrome
1 - I DO (unexpectedly) get the custom action that is set on the .remove API call
2 - I cannot close the 'Delete' form modal - nothing works, not the Escape button, not the Close button or clicking outside the modal.

If using IE
1 - I DO NOT get the custom action that is set on the .remove API call (as expected)
2 - I can close the 'Delete' form modal but nothing has been deleted.

Any ideas??
Many thanks

allan

Agreed this is odd!

The onReturn was actually only intended for operation when focus is on the field inputs - it does not respect the buttons at the bottom of the form. So onReturn will have no effect when the focused. Indeed, the onReturn code only runs when there is a field focused!

So what I think is happening in Chrome is that it is itself submitting the <form> element, but that is only partially what Editor needs - it needs its submit method to be called.

If you use the keyboard's tab key to move focus to the Submit button and then press return, it will correctly submit.

I think to resolve this, I need to:

1) Update the docs to make clear that onReturn is for when focused on fields only.
2) Find out why Chrome is submitting the form on return when the button is not focused and stop it.

Does that sound fair?

Allan

Andy Read

Thanks Allan, that all sounds good.
I think I am able to get around the submission/onReturn issue but my main problem is the persisting 'Delete' form which cannot be cleared. It's as if all 'close' functions get removed from the controls so that nothing can be done to remove the form from the screen.
I'm just concerned that if someone hits 'return' (by accident) when the delete form is up, they won't be able to clear it and will be confused.
Many thanks
Andy