Editors for ASP.NET Web Forms - How to raise validation on the client

This example demonstrates how to raise client-side validation automatically or on a specific action for a single editor or a group of editors.

Overview

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>

Files to Review

• Default.aspx (VB: Default.aspx)

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)