-
-
Notifications
You must be signed in to change notification settings - Fork 2.8k
Description
Imagine the following scenario:
- My web app is validating both server-side and client-side (as one would expect!)
- Both the server and client generate the same markup for an error, for example's sake let's say a
<label>
- The user submits the form, the data validates client-side, and gets submitted to server
- For whatever reason the server-side validation fails, an error label is generated and the user is returned to the page to correct the error
- The user then begins to update the invalid fields...
I would expect at this point that the validation plugin will update any pre-existing (i.e. server-generated) error labels as the user types, however this is not the case - the label will only be updated if the server ouputs a label with the attribute generated="true"
.
The following line is responsible for making this decision whether the label is a suitable target to be updated:
// check if we have a generated label, replace the message then
if ( label.attr("generated") ) {
label.html(message);
}
The simple solution is to output this attribute server-side, but that means generating invalid HTML. However, I think it would be good to offer this as an extensibility point so that the situation i have outlined can be dealt with simply, avoiding invalid markup. Alternatively you could make this check a little bit more intelligent:
// check if we have a generated label (or assume a label with the error class is a satisfactory target), replace the message then
if ( label.attr("generated") || label.hasClass(this.settings.errorClass) ) {
label.html(message);
}
It is fair to assume this will only ever update the correct label as it is highly unlikely that another label will exist for the current element which has already been decorated with the errorClass
.