How to: Implement a Custom Validation
- 3 minutes to read
To implement a custom validation, you can handle the server-side ASPxEdit.Validation event or the client-side ASPxClientEdit.Validation event. But it is recommended that you perform both the client-side and server-side validations for security reasons.
Within the events, you can test the editor’s edit value, which is accessed via the e.Value/e.value (ValidationEventArgs.Value/ASPxClientEditValidationEventArgs.value) property, against custom validation criteria. If the entered value doesn’t meet your restrictions, you can specify the editor as invalid by setting the event parameter’s e.IsValid/e.isValid (ASPxEdit.IsValid/ASPxClientEditValidationEventArgs.isValid) property to false. Additionally, you can provide a text explaining why the validation has failed by assigning a descriptive text to the e.ErrorText/e.errorText (ValidationEventArgs.ErrorText/ASPxClientEditValidationEventArgs.errorText) property. When an editor is invalid, the specified text will be displayed within a specific message box.
The code sample below demonstrates how you can perform custom client-side validation to limit an permissible user age. For this purpose, the ASPxClientEdit.Validate event is handled.
function OnBirthdayValidation(s, e) {
var birthday = e.value;
if(!birthday)
return;
var today = new Date();
var msecPerYear = 1000 * 60 * 60 * 24 * 365;
var years = (today.getTime() - birthday.getTime()) / msecPerYear;
if(years < 14) {
e.isValid = false;
e.errorText = "You should be at least 14 years old.";
}
}
Note
An error frame is automatically rendered on the client side in the following situations.
- The ASPxClientEdit.Validation or ASPxEdit.Validation event is handled.
- The ValidationSettings.RequiredField or ValidationSettings.RegularExpression property is specified.
- The ASPxEdit.IsValid property is initially set to false.
Otherwise the error frame is not rendered to the client side as being unnecessary.
However, in some scenarios you need to perform the editor’s validation fully by yourself without using any of the predefined validation capabilities. In these cases, set the ValidationSettings.EnableCustomValidation property to true to force the editor to render the error frame to the client side.
The code sample below demonstrates how you can perform a custom validation without using any predefined validation capabilities. Note that in this case, the ValidationSettings.EnableCustomValidation property should be set to true to show an error frame.
function OnAgeValidation(s, e) {
var age = tbAge.GetText();
if (age == null || age == "")
return;
var digits = "0123456789";
for (var i = 0; i < age.length; i++) {
if (digits.indexOf(age.charAt(i)) == -1) {
tbAge.SetIsValid(false);
break;
}
}
if (tbAge.GetIsValid() && age.charAt(0) == '0') {
age = age.replace(/^0+/, "");
if (age.length == 0)
age = "0";
tbAge.SetText(age);
}
if (age < 18) {
tbAge.SetIsValid(false);
tbAge.SetErrorText('Age must be greater than or equal 18');
}
}