I have created my own conditional validation attribute to validate my MVC model on both the client and the server by inheriting from RequiredAttribute
and implementing IClientValidatable
. The idea is that if a boolean property on my model is true, then another property is required. In the view this manifests itself as a checkbox which dictates whether a textbox needs to be filled in.
This works perfect except for when the user performs the following actions:
- Checks the checkbox (the field is now required).
- Submits the form (client side validation runs, error message displayed).
- User unchecks box (error message remains, field no longer required).
I would like to revalidate the form when the checkbox is checked or unchecked, or even better just revalidate that field, so that the error message is no longer displayed. I have tried various combinations of calling the jQuery validate()
method, but nothing seems to be able to re-run validation.
I use the following javascript to set up my validation function and the associated unobtrusive adapter.
$.validator.addMethod(
"requiredif",
function(value, element, parameters) {
var selector = "#" + parameters["dependentpropertyname"];
var triggerValue = parameters["triggervalue"].toString().toLowerCase();
var actualValue = $(selector).is(":checked").toString().toLowerCase();
if (actualValue === triggerValue) return $.validator.methods.required.call(this, value, element, parameters);
return true;
});
$.validator.unobtrusive.adapters.add(
"requiredif",
["dependentpropertyname", "triggervalue"],
function(options) {
options.rules["requiredif"] = {
dependentpropertyname: options.params["dependentpropertyname"],
triggervalue: options.params["triggervalue"]
};
options.messages["requiredif"] = options.message;
}
);
Thanks!