This example demonstrates how to raise client-side validation automatically or on a specific action for a single editor or a group of editors.
To automatically raise validation when an editor's value changes to empty, specify the editor's ValidationSettings property and set the RequiredField.IsRequired property to true
. Note that this behavior is enabled when the ValidateOnLeave property is set to true
.
<dx:ASPxTextBox ID="tbTextBox1" runat="server" Width="170px" Text="Some value">
<ValidationSettings>
<RequiredField IsRequired="True" ErrorText="Field is required." />
</ValidationSettings>
</dx:ASPxTextBox>
To validate edit values on a specific action (for example, on a button click), call the client-side Validate method. To disable automatical validation when the editor's value changes, set the ValidateOnLeave property to false
.
<input type="button" value="Validate" onclick="ASPxClientControl.GetControlCollection().GetByName('tbTextBox2').Validate();" style="width: 127px;" />
<dx:ASPxTextBox ID="tbTextBox2" runat="server" ClientInstanceName="tbTextBox2" Width="170px">
<ValidationSettings ValidateOnLeave="False">
<RequiredField IsRequired="True" ErrorText="Field is required." />
</ValidationSettings>
</dx:ASPxTextBox>
To validate values in a group of editors on a specific action, disable editors' ValidateOnLeave properties, set ValidationGroup properties to a common value, and pass this value to the client-side ValidateGroup method.
<dx:ASPxTextBox ID="tbTextBox3" runat="server" Width="170px" Style="margin-bottom: 4px;">
<ValidationSettings ValidationGroup="MyGroup" ErrorText="Field is required." ValidateOnLeave="False">
<RequiredField IsRequired="True" ErrorText="" />
</ValidationSettings>
</dx:ASPxTextBox>
<dx:ASPxTextBox ID="tbTextBox4" runat="server" Width="170px">
<ValidationSettings ValidationGroup="MyGroup" ErrorText="Field is required." ValidateOnLeave="False">
<RequiredField IsRequired="True" ErrorText="" />
</ValidationSettings>
</dx:ASPxTextBox>
<br />
<input type="button" value="Validate Group" onclick="ASPxClientEdit.ValidateGroup('MyGroup');" />
To validate values in a group of editors on a postback, enable editors' AutoPostBack, ValidateOnLeave, and CausesValidation properties and set their ValidationGroup properties to a common value. When an editor's value changes, validation is raised for all editors in the specified group.
<dx:ASPxComboBox ID="cbComboBox2" runat="server" AutoPostBack="True">
<Items>
<!-- ... -->
</Items>
<ValidationSettings CausesValidation="True" ValidationGroup="CausesValidationDemoGroup">
<RequiredField IsRequired="True" ErrorText="Select not empty value." />
</ValidationSettings>
</dx:ASPxComboBox>
<br />
<dx:ASPxComboBox ID="cbComboBox3" runat="server" AutoPostBack="True">
<Items>
<!-- ... -->
</Items>
<ValidationSettings CausesValidation="True" ValidationGroup="CausesValidationDemoGroup">
<RequiredField IsRequired="True" ErrorText="Select not empty value." />
</ValidationSettings>
</dx:ASPxComboBox>
- Default.aspx (VB: Default.aspx)
(you will be redirected to DevExpress.com to submit your response)