DT within BS Modal - Inline editing issue when the user does not submit changes
DT within BS Modal - Inline editing issue when the user does not submit changes
I have a BS modal which contains a DataTable, the DataTable has inline editing enabled, the user double clicks the cell to edit the data within that cell, 99.9% of the time the user will press 'Enter' to submit the changes, but some users leave the field in edit mode, and then they click the 'Close' button on the modal, this causes the console to throw the error 'oFeatures is undefined'.
The reason for this error is when a user clicks the 'Close' button on my modal, my code wipes the content of the modal (including the DataTable), and I believe this is happening before the DataTable has a chance to submit the changes, hence the error.
The modal 'Close' button behaviour is by design and used extensively throughout my web-apps, so what I'm looking for is a DataTable method I can call which will submit any 'dirty' data before I wipe the DataTable. I've tried searching for such a method on your forums without luck, any help\advice greatly appreciated?
ps. I can provide access to a demo system, please pm if you require this?
Thanks, Chris
This question has an accepted answers - jump to answer
Answers
Hi Chris,
You should listen for the
hide.bs.modal
event that the modal will trigger on close and in it call thesubmit()
method if there is a.DTE
element inside the modal (you might be able to skip the check for the element,submit()
doesn't do anything if there is no active state, but I think it would be a good idea to check.The only issue I can see with this is that the submit action is async. If the data submitted results in a validation error, then the error message wouldn't be seen by the user.
It gets a bit messy, but if that is a possible issue, you might need to prevent the modal from being closed (
e.preventDefault()
I think does it in Bootstrap), submit the form and then when it completes close the modal if all is good.Allan
Hi Allan,
Of course, I should of thought of .submit().
Apologies, I wrote some functions awhile back that auto-generates all the DataTable CSS\JS\HTML code, so I have not worked with any DataTable code for awhile, hence the brain fog
Thanks, Chris