Input

Controls

Rate this demo

Thank you for your post!
Submit a support ticket
If you have an active license or trial, you have access to dedicated support from Telerik’s developers. Response time is 24h for active licenses and 72h for trials, Mon-Fri.
Post in the forums
If you don’t have access to support or would like to help other people by sharing your problem, reach out to our active community in the forums.

Input - Validation

Registration form
Name:
Age:
Phone:
Email
Hire Date:




Type some data in the input controls then press the submit button. ASP.NET validation would fail in case of invalid or missing data.

RadInput supports client and server-side ASP.NET validation. This example shows how to use RequiredFieldValidator, RangeValidator and RegularExpressionValudator with RadNumericTextBox, RadTextBox, RadDateInput and RadMaskedTextBox. All you need to do is set the ControlToValidate property of your validator to point to the respective input instance.

C# VB
Show code in new window Demo isolation steps
<%@ Page Language="c#" CodeFile="DefaultCS.aspx.cs" AutoEventWireup="false" Inherits="Telerik.InputExamplesCS.Common.Validation.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>ASP.NET Input Demo - Validation</title>
    <link href="Styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" />
    <telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
        <fieldset>
            <legend>Registration form</legend>
            <br />
            <table border="0" cellpadding="5">
                <colgroup>
                    <col width="100" />
                    <col width="500" />
                </colgroup>
                <tr class="FormContainer">
                    <td>
                        Name:
                    </td>
                    <td>
                        <telerik:RadTextBox ID="RadTextBox1" runat="server"></telerik:RadTextBox>
                        <asp:RequiredFieldValidator ID="TextBoxRequiredFieldValidator" runat="server" Display="Dynamic"
                            ControlToValidate="RadTextBox1" ErrorMessage="The textbox can not be empty!"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr class="FormContainer">
                    <td>
                        Age:
                    </td>
                    <td>
                        <telerik:RadNumericTextBox ID="RadNumericTextBox1" runat="server" Type="Number" NumberFormat-DecimalDigits="0">
                        </telerik:RadNumericTextBox>
                        <asp:RequiredFieldValidator ID="NumercTextBoxRequiredFieldValidator" runat="server"
                            Display="Dynamic" ControlToValidate="RadNumericTextBox1" ErrorMessage="Please, select an year number!"></asp:RequiredFieldValidator>
                        <asp:RangeValidator ID="NumericTextBoxRangeValidator" runat="server" ControlToValidate="RadNumericTextBox1"
                            ErrorMessage="Year number should be a non negative less than 50." Display="Dynamic"
                            MaximumValue="50" MinimumValue="0" Type="Integer"></asp:RangeValidator>
                    </td>
                </tr>
                <tr class="FormContainer">
                    <td valign="top">
                        Phone:
                    </td>
                    <td>
                        <telerik:RadMaskedTextBox ID="RadMaskedTextBox1" runat="server" Mask="(###)-######">
                        </telerik:RadMaskedTextBox>
                        <asp:RequiredFieldValidator Display="Dynamic" ID="MaskedTextBoxRequiredFieldValidator"
                            runat="server" ErrorMessage="Please, enter a phone number." ControlToValidate="RadMaskedTextBox1"></asp:RequiredFieldValidator>
                        <asp:RegularExpressionValidator Display="Dynamic" ID="MaskedTextBoxRegularExpressionValidator"
                            runat="server" ErrorMessage="Format is (###)-######" ControlToValidate="RadMaskedTextBox1"
                            ValidationExpression="\(\d{3}\)-\d{6}"></asp:RegularExpressionValidator>
                    </td>
                </tr>
                <tr class="FormContainer">
                    <td valign="top">
                        Email
                    </td>
                    <td>
                        <telerik:RadTextBox ID="Radtextbox2" runat="server"></telerik:RadTextBox>
                        <asp:RegularExpressionValidator ID="emailValidator" runat="server" Display="Dynamic"
                            ErrorMessage="Please, enter valid e-mail address." ValidationExpression="^[\w\.\-]+@[a-zA-Z0-9\-]+(\.[a-zA-Z0-9\-]{1,})*(\.[a-zA-Z]{2,3}){1,2}$"
                            ControlToValidate="Radtextbox2">
                        </asp:RegularExpressionValidator>
                        <asp:RequiredFieldValidator ID="Requiredfieldvalidator1" runat="server" Display="Dynamic"
                            ControlToValidate="Radtextbox2" ErrorMessage="Please, enter an e-mail!"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr class="FormContainer">
                    <td>
                        Hire&nbsp;Date:
                    </td>
                    <td>
                        <telerik:RadDateInput ID="RadDateInput1" runat="server" DateFormat="d" MinDate="01/01/1990"
                            MaxDate="01/01/3000"></telerik:RadDateInput>
                        <asp:RangeValidator ID="DateInputRangeValidator" runat="server" ControlToValidate="RadDateInput1"
                            ErrorMessage="Choose a date between 5th of January 2005 and 1st of September 2005"
                            Display="Dynamic" MaximumValue="2005-09-01-00-00-00" MinimumValue="2005-01-05-00-00-00"></asp:RangeValidator>
                        <asp:RequiredFieldValidator ID="PickerRequiredFieldValidator" runat="server" Display="Dynamic"
                            ControlToValidate="RadDateInput1" ErrorMessage="Please select a date"></asp:RequiredFieldValidator>
                    </td>
                </tr>
            </table>
            <br />
            <br />
            <asp:CheckBox OnCheckedChanged="CheckBox1_CheckedChanged" ID="CheckBox1" runat="server"
                Text="Client Side Validation" Checked="True" CssClass="CheckBox" AutoPostBack="True"></asp:CheckBox>
            <br />
            <br />
            <asp:Button ID="Button1" runat="server" Text="Postback"></asp:Button>
            <input type="reset" value="Reset" />
        </fieldset>
    </telerik:RadAjaxPanel>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"></telerik:RadAjaxLoadingPanel>
    </form>
</body>
</html>