Category / Section
How to perform email validation in the MaskEdit control
1 min read
You can perform email validation in the maskEdit control using jQuery validation. To perform email validation, the jquery.validate script must be referenced in application.
The maskEdit control contains hidden element that holds value, and this hidden element is not validated by default. So, to perform validation, include hidden element in jQuery validation, and set “[]” in the “ignore” API of “$.validator.setDefaults” as demonstrated in the following code example.
<script>
$.validator.setDefaults({
// To validate all fields (including hidden fields)
ignore: [],
// If you do not set custom class, the default “error” class will be added
errorClass: 'e-validation-error',
// It specifies the display position of error message
errorPlacement: function (error, element) {
$(error).insertAfter(element.closest(".e-widget"));
}
});
</script>
You can specify the email validation rule and validation message using the validationRules and validationMessage APIs of the maskEdit control, respectively. The following code example demonstrates how to specify the email validation.
<input id="emailAddressTextInput" name="emailAddressTextInput" />
<script>
$("#emailAddressTextInput").ejMaskEdit({
watermarkText: "Email Address",
inputMode: ej.InputMode.Text,
validationRules: { required: true, email: true },
validationMessage: { email: "Enter valid mail id" }
});
</script>
Final output
