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

Validation

 
 
 
Validating the dates picked by the user can be done by using the standard ASP.NET validator controls. This example shows a sample period selection page. The user has to enter two dates, the second one being after the first.

We are using two RequiredFieldValidator instances to ensure the date pickers are not left empty. A CompareValidator ensures that the second date is greater than the first one.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page CodeFile="DefaultCS.aspx.cs" Language="c#" AutoEventWireup="false" Inherits="Telerik.Web.Examples.Calendar.Functionality.Validation.DefaultCS" %>

<%@ 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 href="styles.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-thin " runat="server" id="containerDiv">
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
            <table>
                <tr>
                    <td>
                        <telerik:RadDatePicker RenderMode="Lightweight" ID="RadDatePicker1" MinDate="2009/1/1" runat="server" DateInput-Label="Start Date:" DateInput-LabelWidth="100px" Width="100%">
                        </telerik:RadDatePicker>
                        <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" ControlToValidate="RadDatePicker1"
                            ErrorMessage="Enter a date!"></asp:RequiredFieldValidator>

                    </td>
                </tr>
                <tr>
                    <td>
                        <telerik:RadDatePicker RenderMode="Lightweight" ID="RadDatePicker2" MinDate="2009/1/1" runat="server" DateInput-Label="End Date:" Width="100%">
                        </telerik:RadDatePicker>
                        <asp:RequiredFieldValidator runat="server" ID="Requiredfieldvalidator2" ControlToValidate="Raddatepicker2"
                            ErrorMessage="Enter a date!"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        <asp:CompareValidator ID="dateCompareValidator" runat="server" ControlToValidate="Raddatepicker2"
                            ControlToCompare="RadDatePicker1" Operator="GreaterThan" Type="Date" ErrorMessage="The second date must be after the first one.<br /><br />">
                        </asp:CompareValidator>
                    </td>

                </tr>
                <tr>
                    <td>
                        <asp:Label ID="Label1" runat="server"></asp:Label>
                    </td>
                </tr>
            </table>
            <telerik:RadButton RenderMode="Lightweight" runat="server" Text="Save" ID="Button1" OnClick="Button1_Click"></telerik:RadButton>
        </telerik:RadAjaxPanel>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance