Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q1 2012 released 04/11/2012
select

Input / Validation

FormValidationGroup
City:
Age:
Spin UpSpin Down
Birth date:


Employees


Last Name: Davolio
First Name: Nancy
Hire date: 5/1/1992 12:00:00 AM
 
Last Name: Fuller
First Name: Andrew
Hire date: 8/14/1992 12:00:00 AM
 
Last Name: Leverling
First Name: Janet
Hire date: 4/1/1992 12:00:00 AM
 
Last Name: Peacock
First Name: Margaret
Hire date: 5/3/1993 12:00:00 AM
 
123

  • The RadInput in Single Rendering Mode fully supports client and server-side ASP.NET validation. The following example demonstrates the validation mechanism(s) for the single rendered inputs and for inputs in single rendering mode added to a binding control.

Source Code

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

    <%@ Register TagPrefix="telerik" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="telerik" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <%@ 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">
        <telerik:HeadTag runat="server" ID="Headtag2"></telerik:HeadTag>
        <style type="text/css">
            .defList
            {
                overflow: hidden;
            }
            .defList dt
            {
                float: left;
                width: 150px;
                clear: both;
                margin-bottom: 20px;
            }
            
            .defList dd
            {
                width: 450px;
                float: left;
                margin-bottom: 20px;
            }
            
            .LableStyle
            {
                color: Black;
                font-weight: bold;
                margin-left: 122px;
            }
            
            .button
            {
                margin-top: 15px;
            }
            
            .EmployeeContainer
            {
                margin-right: -8px;
                overflow: hidden;
            }
            
            .EmployeeContainer fieldset
            {
                float: left;
                width: 364px;
                height: 190px;
                margin: 0 7px 5px 0;
                padding: 0 7px;
            }

            .birthDateTxt
            {
                float: left;
                margin-right: 10px;
            }
        </style>
    </head>
    <body class="BODY">
        <form runat="server" id="mainForm" method="post">
        <div>
            <telerik:Header runat="server" ID="Header1" NavigationLanguage="CS"></telerik:Header>
            <!-- content start -->
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
            <telerik:RadCodeBlock ID="RCB1" runat="server">
                <script type="text/javascript">
              <!--
                    function Button1_ClientClick() {
                        $get("Label1").innerHTML = "";
                    }
    -->
                </script>
            </telerik:RadCodeBlock>
            <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" />
            <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"/>
            <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
                <div style="width: 78%">
                    <table width="100%">
                        <tr>
                            <td style="width: 60%">
                                <fieldset style="padding: 5px">
                                    <legend>FormValidationGroup</legend>
                                    <dl class="defList">
                                        <dt>City: </dt>
                                        <dd>
                                            <telerik:RadTextBox runat="server" EnableSingleInputRendering="true" ID="city">
                                            </telerik:RadTextBox>
    <asp:RequiredFieldValidator runat="server" ForeColor="Red" ID="RequiredFieldValidator5"
    ControlToValidate="city" Display="Dynamic" ErrorMessage="City is required" ValidationGroup="FormValidationGroup" />
                                        </dd>
                                        <dt>Age: </dt>
                                        <dd>
                                            <telerik:RadNumericTextBox ID="RadNumericTextBox1" NumberFormat-DecimalDigits="0"
                                                runat="server" ShowSpinButtons="true" EnableSingleInputRendering="true">
                                            </telerik:RadNumericTextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator6" ForeColor="Red" ValidationGroup="FormValidationGroup"
    runat="server" Display="Dynamic" ControlToValidate="RadNumericTextBox1" ErrorMessage="Please select age!" />
    <asp:RangeValidator ID="RangeValidator1" ForeColor="Red" ValidationGroup="FormValidationGroup"
    runat="server" ControlToValidate="RadNumericTextBox1" ErrorMessage="The age should be greater than 18 years!"
    Display="Dynamic" MaximumValue="100" MinimumValue="18" Type="Integer" />
                                        </dd>
                                        <dt>Birth date: </dt>
                                        <dd>
                                            <telerik:RadDateInput runat="server" ID="RadDateInput2" WrapperCssClass="birthDateTxt" EnableSingleInputRendering="true">
                                            </telerik:RadDateInput>
    <asp:RangeValidator ID="RangeValidator2" ForeColor="Red" runat="server" ControlToValidate="RadDateInput2"
    ErrorMessage="Choose a date between 20th of October 1911 and 20th of October 1993"
    Display="Dynamic" MaximumValue="1993-20-10-00-00-00" ValidationGroup="FormValidationGroup"
    MinimumValue="1911-20-10-00-00-00" />
    <asp:RequiredFieldValidator ID="RequiredFieldValidator8" ForeColor="Red" runat="server"
    Display="Dynamic" ControlToValidate="RadDateInput2" ValidationGroup="FormValidationGroup"
    ErrorMessage="Please select birth date!" />
                                        </dd>
                                    </dl>
    <asp:Button CausesValidation="true" runat="server" ID="Button3" OnClientClick="Button1_ClientClick()"
    OnClick="Button1_Click" CssClass="button" Text="PostBack" ValidationGroup="FormValidationGroup" />
                                    <asp:Label ID="Label1" runat="server" CssClass="LableStyle"></asp:Label>
                                </fieldset>
                            </td>
                        </tr>
                    </table>
                </div>
                <br />
                <br />
                <telerik:RadListView ID="RadListView1" DataSourceID="SqlDataSource1" runat="server"
                    ItemPlaceholderID="EmployeeContainer" DataKeyNames="EmployeeID" PageSize="4"
                    AllowPaging="True">
                    <ValidationSettings EnableValidation="true" />
                    <LayoutTemplate>
                        <fieldset style="width: 770px; padding: 5px">
                            <legend>Employees</legend>
                            <table cellpadding="0" cellspacing="0" style="width: 770px;">
                                <tr>
                                    <td>
    <asp:Button ID="Button1" runat="server" CssClass="button" CommandName="InitInsert"
    Visible="<%# !Container.IsItemInserted %>" Text="Add new employee" />
                                        <br />
                                        <br />
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="EmployeeContainer">
                                            <asp:Panel ID="EmployeeContainer" runat="server" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1"
                                            PageSize="4">
                                            <Fields>
                                                <telerik:RadDataPagerButtonField FieldType="FirstPrev" />
                                                <telerik:RadDataPagerButtonField FieldType="Numeric" />
                                                <telerik:RadDataPagerButtonField FieldType="NextLast" />
                                            </Fields>
                                        </telerik:RadDataPager>
                                    </td>
                                </tr>
                            </table>
                        </fieldset>
                    </LayoutTemplate>
                    <ItemTemplate>
                        <fieldset>
                            <table cellpadding="2" cellspacing="0" style="height: 100%;">
                                <tr>
                                    <td style="width: 40%;">
                                        Last Name:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <%# Eval("LastName")%>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        First Name:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <%# Eval("FirstName")%>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Hire date:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <%# Eval("HireDate")%>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
    <asp:ImageButton ID="ImageButton1" runat="server" CommandName="Edit" CausesValidation="false"
    ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/Img/Edit.gif" />&nbsp;
                                        <asp:ImageButton ID="ImageButton2" runat="server" CommandName="Delete" ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/Img/Delete.gif" />
                                    </td>
                                </tr>
                            </table>
                        </fieldset>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <fieldset>
                            <table cellpadding="0" cellspacing="2" style="height: 100%">
                                <tr>
                                    <td style="width: 40%;">
                                        Last Name:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <telerik:RadTextBox ID="TextBox1" EnableSingleInputRendering="true" runat="server"
                                            Text='<%# Bind("LastName") %>' Width="100px" />
    <asp:RequiredFieldValidator runat="server" ForeColor="Red" ID="RequiredFieldValidator1"
    ControlToValidate="TextBox1" ErrorMessage="*" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        First name:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <telerik:RadTextBox ID="TextBox2" EnableSingleInputRendering="true" runat="server"
                                            Text='<%# Bind("FirstName") %>' Width="100px" />
    <asp:RequiredFieldValidator runat="server" ForeColor="Red" ID="RequiredFieldValidator2"
    ControlToValidate="TextBox2" ErrorMessage="*" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Hire date:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <telerik:RadDateInput ID="RadDateInput1" runat="server" EnableSingleInputRendering="true"
                                            SelectedDate='<%# Bind("HireDate") %>' Width="65px" />
    <asp:RangeValidator ID="DateInputRangeValidator" ForeColor="Red" 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:RequiredFieldValidator runat="server" ID="RequiredFieldValidator3" ForeColor="Red"
    ControlToValidate="RadDateInput1" ErrorMessage="*" />
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <asp:ImageButton ID="Button1" runat="server" CommandName="Update" ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/Img/Update.gif" />
    <asp:ImageButton ID="Button2" runat="server" CommandName="Cancel" CausesValidation="false"
    ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/Img/Cancel.gif" />
                                    </td>
                                </tr>
                            </table>
                        </fieldset>
                    </EditItemTemplate>
                    <InsertItemTemplate>
                        <fieldset>
                            <table cellpadding="0" cellspacing="2" style="height: 100%">
                                <tr>
                                    <td style="width: 40%;">
                                        Last Name:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <telerik:RadTextBox ID="TextBox1" runat="server" EnableSingleInputRendering="true"
                                            Text='<%# Bind("LastName") %>' Width="100px" />
    <asp:RequiredFieldValidator runat="server" ForeColor="Red" ID="RequiredFieldValidator1"
    ControlToValidate="TextBox1" ErrorMessage="*" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        First Name:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <telerik:RadTextBox ID="TextBox2" runat="server" EnableSingleInputRendering="true"
                                            Text='<%# Bind("FirstName") %>' Width="100px" />
    <asp:RequiredFieldValidator runat="server" ForeColor="Red" ID="RequiredFieldValidator2"
    ControlToValidate="TextBox2" ErrorMessage="*" />
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Hire date:
                                    </td>
                                    <td style="width: 80%; padding-left: 5px;">
                                        <telerik:RadDateInput ID="RadDateInput1" runat="server" EnableSingleInputRendering="true"
                                            SelectedDate='<%# Bind("HireDate") %>' Width="65px" />
    <asp:RangeValidator ID="DateInputRangeValidator" ForeColor="Red" 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:RequiredFieldValidator runat="server" ForeColor="Red" ID="RequiredFieldValidator3"
    ControlToValidate="RadDateInput1" ErrorMessage="*" />
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <asp:ImageButton ID="Button1" runat="server" CommandName="PerformInsert" ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/Img/Update.gif" />
    <asp:ImageButton ID="Button2" runat="server" CommandName="Cancel" CausesValidation="false"
    ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/Img/Cancel.gif" />
                                    </td>
                                </tr>
                            </table>
                        </fieldset>
                    </InsertItemTemplate>
                </telerik:RadListView>
                <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
                    <Windows>
                        <telerik:RadWindow ID="RadWindow1" runat="server">
                            <ContentTemplate>
                                "The validation passed successfully"
                            </ContentTemplate>
                        </telerik:RadWindow>
                    </Windows>
                </telerik:RadWindowManager>
            </telerik:RadAjaxPanel>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                DeleteCommand="DELETE FROM [Employees] WHERE [EmployeeID] = @EmployeeID" InsertCommand="INSERT INTO [Employees] ([LastName], [FirstName], [HireDate]) VALUES (@LastName, @FirstName, @HireDate)"
                SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [HireDate] FROM [Employees]"
                UpdateCommand="UPDATE [Employees] SET [LastName] = @LastName, [FirstName] = @FirstName, [HireDate] = @HireDate WHERE [EmployeeID] = @EmployeeID">
                <DeleteParameters>
                    <asp:Parameter Name="EmployeeID" Type="Int32" />
                </DeleteParameters>
                <UpdateParameters>
                    <asp:Parameter Name="LastName" Type="String" />
                    <asp:Parameter Name="FirstName" Type="String" />
                    <asp:Parameter Name="HireDate" Type="DateTime" />
                    <asp:Parameter Name="EmployeeID" Type="Int32" />
                </UpdateParameters>
                <InsertParameters>
                    <asp:Parameter Name="LastName" Type="String" />
                    <asp:Parameter Name="FirstName" Type="String" />
                    <asp:Parameter Name="HireDate" Type="DateTime" />
                </InsertParameters>
            </asp:SqlDataSource>
            <telerik:Footer runat="server" ID="Footer1"></telerik:Footer>
        </div>
        </form>
    </body>
    </html>

Get more than expected!

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2012 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451