New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Validation with Default Item

Selection form

Search form

Validation groups allow you to organize validation controls on a page as a set. Each validation group can perform validation independently from other validation groups on the page. You create a validation group by setting the ValidationGroup property to the same name (a string) for all the controls you want to group. You can assign any name to a validation group, but you must use the same name for all members of the group.

There are two validation groups in this example:

  1. The "SelectionFormValidationGroup" contains two RadComboBox controls which are validated by CustomFieldValidator control. The javascript method iterates through all RadComboBoxes DOM objects and validate their's value properties. When DefaultItem is set it's value is set to the RadComboBox's DOM object value property.
  2. The "SearchFormValidationGroup" contains a RadTextBox and a RadComboBox which are validated by two RequiredFieldValidator controls. The ValidationGroup property of the validators and the "Search" button is set to SearchFormValidationGroup. Pressing the "Search" button will trigger validation only for the SearchFormValidationGroup.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • scripts.js
  • styles.css
<%@ Page Inherits="ComboBox.Examples.Functionality.ValidationGroup.DefaultCS" Language="c#"CodeFile="DefaultCS.aspx.cs"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />
    <script type="text/javascript" src="scripts.js"></script>
</head>

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">
        <script type="text/javascript">
            //<![CDATA[
            Sys.Application.add_load(function () {
                window.demo.comboBoxes = $telerik.$(".selection-form .RadComboBox");
                demo.initialize();
            });
            //]]>
        </script>
    </telerik:RadCodeBlock>

    <div class="demo-container">
        <fieldset class="qsf-fb selection-form">
            <h3>Selection form</h3>
            <ul>
                <li>
                    <label>Gender:</label>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBox2" runat="server" Skin="Office2010Blue"  />
                </li>
                <li>
                    <label>Age:</label>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBox3" runat="server" Skin="Office2010Blue"  />
                </li>
                <li>
                    <label>Country:</label>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBox4" runat="server" Skin="Office2010Blue"  />
                </li>
            </ul>
            <asp:CustomValidator ID="CustomValidator1" ErrorMessage="Please choose your gender, age and country !" ClientValidationFunction="selectionFormValidationGroup"
                ValidationGroup="SelectionFormValidationGroup" runat="server" CssClass="validator" />
            <p class="buttons">

                <telerik:RadButton RenderMode="Lightweight" ID="SubmitButton1" runat="server" Text="Submit" ValidationGroup="SelectionFormValidationGroup" Skin="Office2010Blue" ></telerik:RadButton>
            </p>
        </fieldset>

        <fieldset class="qsf-fb search-form">
            <h3>Search form</h3>
            <ul>
                <li>
                    <label>Find a video:</label>
                    <telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="RadTextBox1" Skin="Office2010Blue"  />
                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1"
                        ControlToValidate="RadTextBox1" ValidationGroup="SearchFormValidationGroup"
                        ErrorMessage="Please enter a name" CssClass="validator" />
                </li>
                <li>
                    <label>Search in:</label>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBox1" runat="server" Skin="Office2010Blue"  />
                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator2" InitialValue="- Search in -"
                        ControlToValidate="RadComboBox1" ValidationGroup="SearchFormValidationGroup"
                        ErrorMessage="Please select a search location" CssClass="validator" />
                </li>
            </ul>
            <p class="buttons">
                <telerik:RadButton RenderMode="Lightweight" ID="SearchButton1" runat="server" ValidationGroup="SearchFormValidationGroup" Text="Search" Skin="Office2010Blue" ></telerik:RadButton>
            </p>
        </fieldset>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance