on general error, Inline Edit requires two enter key presses after field correction to submit
on general error, Inline Edit requires two enter key presses after field correction to submit
After I send back a general error, Inline Edit requires two enter key presses after I correct the field to actually submit.
I'm using a custom framework, check out the pseudo-code below. I pass the AJAX interceptor 'success' function to be fired in doResults
. It works, trust me. Additionally, I'm also using preSubmit()
to do client-side validation of the fields.
On the SQL side, I check for a constraint issue. If I find an issue, I'll send back a JSON response like this: {"error", "this is a general error"}
This is ultimately processed by the successCB (show below).
- The error is displayed correctly.
- You correct the filed, press enter
- The error disappears, nothing is submitted
- Press enter again, the form submits.
The success
function appears to be very robust -- you can feed it Editor errors akin to editor.error("error message")
.
However, is this function intended to process form error results? How do I prevent the double-enter?
ajax: function (method, url, data, successCB, error) {
//pass data and the actual function 'successCB' to SQL Server
doRequest(data.action, successCB);
}
//process results on the client-side
doResults(data, options) {
if (typeof options === 'function') {
successCB = options
jsonString = $(data.xmldata).find("jsonResponse").text();
obj = JSON.parse(jsonString);
successCB(obj) //tell Editor what happened
}
}
Here's preSubmit()
editor.on('preSubmit', function (e, data, action) {
if (action !== 'remove') {
$.each(data.data, function (i) {
$.each(data.data[i], function (key, val) {
switch (key) {
case "PosTitle":
if (val.length > 80 || val.length <= 0) {
editor.error(key, '' + key + ' is required and cannot exceed 80 characters');
}
break;
default:
//do nothing
break;
}
});
});
}
//If any error was reported, cancel the submission so it can be corrected
if (this.inError()) {
return false;
}
});
This question has an accepted answers - jump to answer
Answers
Are you able to give me a link to a test case showing the issue please?
It would also be interesting to add a
console.log( this.inError() );
at the end of yourpreSubmit
event handler. I'm wondering if there is an async action that is causing the problem.Allan
@allan
OK! You finally get to see my framework in its full glory, although simulated.
I might be "splitting hairs", I don't know. Maybe not.
1) keep in mind this example is built to throw back a general error on an edit action
2) start an inline edit on any row
3) modify a JobTitle or PosCode, forget about Publish
4) press enter. edit action simulates a server-side error, "General Error!"
5) change the active field to something else (correct the field)
6) pressing enter clears the general error, but does not submit
7) press enter again to submit
My expectation is, that after correcting the field's data, and pressing enter, it would immediately submit.
http://live.datatables.net/pohunopa/4
Got it - thanks!
The issue is that
error()
is doing an animation while the form is shown, andinError()
checks to see if the error is visible or not (it is, it is being animated closed), so it thinks that the form is in error andreturn false;
is triggered in yourpreSubmit
event handler.The workaround is to use a local
error
flag in yourpreSubmit
handler: http://live.datatables.net/nawaceye/1/edit .I'll look at how to remove that async issue in
inError
. Thanks for letting me know about it.Allan
@allan AWESOME!!