ListView - Flexible validation

Next database reset in 1 hours, 33 minutes, 9 seconds
Products
Name: Chai
Quantity: 10 boxes x 20 bags
Price: $18.00
Units: 39
Discontinued:
 
Name: Chang
Quantity: 24 - 12 oz bottles
Price: $19.00
Units: 17
Discontinued:
 
Name: Aniseed Syrup
Quantity: 12 - 550 ml bottles
Price: $10.00
Units: 13
Discontinued:
 
Name: Chef Anton's Cajun Seasoning
Quantity: 48 - 6 oz jars
Price: $22.00
Units: 53
Discontinued:
 
Name: Chef Anton's Gumbo Mix
Quantity: 36 boxes
Price: $21.35
Units: 0
Discontinued:
 
Name: Grandma's Boysenberry Spread
Quantity: 12 - 8 oz jars
Price: $25.00
Units: 120
Discontinued:
 
FormValidationGroup
SearchValidationGroup

Demo Configurator


Choose validation groupNo group chosen
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

The following example demonstrates the validation mechanism(s) which can be used with the RadListVeiw control. The validation controls (required valiators/custom validators) are added to the related EditItemTemplate and InsertItemTemplate. Essentially, the example shows how to properly link the validation controls to the edit or insert controls of the RadListView control, as well as how to dynamically enable/disable the validation, or change the validation group.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page Language="c#" Inherits="Telerik.ListViewExamplesCSharp.DataEditing.FlexibleServersideValidation.DefaultCS"CodeFile="DefaultCS.aspx.cs"  %>

<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<%@ 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>Telerik ASP.NET Example</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="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container" id="demo-container">
        <telerik:RadFormDecorator RenderMode="Lightweight" ID="RadFormDecorator1" runat="server" DecoratedControls="All" EnableRoundedCorners="false" DecorationZoneID="demo-container" />
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
        </telerik:RadAjaxLoadingPanel>
        <telerik:RadAjaxPanel runat="server" ID="AjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1">
            <telerik:RadListView ID="RadListView1" RenderMode="Lightweight" DataSourceID="SqlDataSource1" runat="server"
                ItemPlaceholderID="ProductItemContainer" DataKeyNames="ProductID" AllowPaging="True">
                <ValidationSettings EnableValidation="true"></ValidationSettings>
                <LayoutTemplate>
                    <fieldset>
                        <legend>Products</legend>
                        <table class="layoutTable">
                            <tr>
                                <td class="button">
                                    <telerik:RadButton RenderMode="Lightweight" ID="Button1" runat="server" CommandName="InitInsert" Visible="<%# !Container.IsItemInserted %>"
                                        Text="Add new product">
                                    </telerik:RadButton>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <asp:Panel ID="ProductItemContainer" runat="server">
                                    </asp:Panel>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server" PagedControlID="RadListView1"
                                        PageSize="6">
                                        <Fields>
                                            <telerik:RadDataPagerButtonField FieldType="FirstPrev"></telerik:RadDataPagerButtonField>
                                            <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                            <telerik:RadDataPagerButtonField FieldType="NextLast"></telerik:RadDataPagerButtonField>
                                        </Fields>
                                    </telerik:RadDataPager>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                </LayoutTemplate>
                <ItemTemplate>
                    <fieldset class="itemFieldset">
                        <table class="itemTable">
                            <tr>
                                <td class="cellLabel">Name:
                                </td>
                                <td class="cellInfo">
                                    <%# Eval("ProductName") %>
                                </td>
                            </tr>
                            <tr>
                                <td>Quantity:
                                </td>
                                <td class="cellInfo">
                                    <%# Eval("QuantityPerUnit") %>
                                </td>
                            </tr>
                            <tr>
                                <td>Price:
                                </td>
                                <td class="cellInfo">
                                    <%# Eval("UnitPrice", "{0:C}") %>
                                </td>
                            </tr>
                            <tr>
                                <td>Units:
                                </td>
                                <td class="cellInfo">
                                    <%# Eval("UnitsInStock") %>
                                </td>
                            </tr>
                            <tr>
                                <td>Discontinued:
                                </td>
                                <td class="cellInfo">
                                    <asp:CheckBox ID="CheckBox1" runat="server" Checked='<%# Eval("Discontinued") %>'
                                        Enabled="false"></asp:CheckBox>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <asp:ImageButton ID="Button1" runat="server" CommandName="Edit" CausesValidation="false"
                                        ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/images/Edit.gif"></asp:ImageButton>&nbsp;
                                    <asp:ImageButton ID="Button2" runat="server" CommandName="Delete" ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/images/Delete.gif"></asp:ImageButton>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                </ItemTemplate>
                <EditItemTemplate>
                    <fieldset class="itemFieldset">
                        <table class="itemTable">
                            <tr>
                                <td class="cellLabel">Name:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox1" runat="server" Text='<%# Bind("ProductName") %>' Width="100px"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator ForeColor="Red" runat="server" ID="RequiredField1" ControlToValidate="TextBox1"
                                        ErrorMessage="*"></asp:RequiredFieldValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Quantity:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox2" runat="server" Text='<%# Bind("QuantityPerUnit") %>' Width="100px"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator ForeColor="Red" runat="server" ID="RequiredFieldValidator2" ControlToValidate="TextBox2"
                                        ErrorMessage="*"></asp:RequiredFieldValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Price:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox3" runat="server" Text='<%# Bind("UnitPrice") %>' Width="80px"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator ForeColor="Red" runat="server" ID="RequiredFieldValidator3" ControlToValidate="TextBox3"
                                        ErrorMessage="*"></asp:RequiredFieldValidator>
                                     <asp:RangeValidator ID="RangeValidator1" runat="server" Type="Double" MinimumValue="0" MaximumValue="1000" ControlToValidate="TextBox3"
                                        ErrorMessage="Invalid" ForeColor="Red"></asp:RangeValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Units:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox4" runat="server" Text='<%# Bind("UnitsInStock") %>' Width="80px"></telerik:RadTextBox>
                                    <asp:CustomValidator runat="server" ID="CustomValidator1" ControlToValidate="TextBox4"
                                        OnServerValidate="CustomValidator1_ServerValidate" ForeColor="Red" ErrorMessage="Invalid"></asp:CustomValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Discontinued:
                                </td>
                                <td class="cellInfo">
                                    <asp:CheckBox ID="CheckBox1" runat="server" Checked='<%# Bind("Discontinued") %>'></asp:CheckBox>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <asp:ImageButton ID="Button1" runat="server" CommandName="Update" ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/images/Update.gif"></asp:ImageButton>
                                    <asp:ImageButton ID="Button2" runat="server" CommandName="Cancel" CausesValidation="false"
                                        ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/images/Cancel.gif"></asp:ImageButton>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                </EditItemTemplate>
                <InsertItemTemplate>
                    <fieldset class="itemFieldset">
                        <table class="itemTable">
                            <tr>
                                <td class="cellLabel">Name:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox1" runat="server" Text='<%# Bind("ProductName") %>' Width="100px"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator ForeColor="Red" runat="server" ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
                                        ErrorMessage="*"></asp:RequiredFieldValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Quantity:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox2" runat="server" Text='<%# Bind("QuantityPerUnit") %>' Width="100px"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator ForeColor="Red" runat="server" ID="RequiredFieldValidator2" ControlToValidate="TextBox2"
                                        ErrorMessage="*"></asp:RequiredFieldValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Price:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox3" runat="server" Text='<%# Bind("UnitPrice") %>' Width="80px"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator ForeColor="Red" runat="server" ID="RequiredFieldValidator3" ControlToValidate="TextBox3"
                                        ErrorMessage="*"></asp:RequiredFieldValidator>
                                    <asp:RangeValidator ID="RangeValidator1" runat="server" Type="Double" MinimumValue="0" MaximumValue="1000" ControlToValidate="TextBox3"
                                        ErrorMessage="Invalid" ForeColor="Red"></asp:RangeValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Units:
                                </td>
                                <td class="cellInfo">
                                    <telerik:RadTextBox RenderMode="Lightweight" ID="TextBox4" runat="server" Text='<%# Bind("UnitsInStock") %>' Width="80px"></telerik:RadTextBox>
                                      <asp:CustomValidator runat="server" ID="CustomValidator1" ControlToValidate="TextBox4"
                                        OnServerValidate="CustomValidator1_ServerValidate" ForeColor="Red" ErrorMessage="Invalid"></asp:CustomValidator>
                                </td>
                            </tr>
                            <tr>
                                <td>Discontinued:
                                </td>
                                <td class="cellInfo">
                                    <asp:CheckBox ID="CheckBox1" runat="server" Checked='<%# Bind("Discontinued") %>'></asp:CheckBox>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <asp:ImageButton ID="Button1" runat="server" CommandName="PerformInsert" ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/images/Update.gif"></asp:ImageButton>
                                    <asp:ImageButton ID="Button2" runat="server" CommandName="Cancel" CausesValidation="false"
                                        ImageUrl="~/ListView/Examples/DefiningStructure/DeclarativeDefinition/images/Cancel.gif"></asp:ImageButton>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                </InsertItemTemplate>
            </telerik:RadListView>
            <div class="divValidation">
                <table class="validationTable">
                    <tr>
                        <td class="validationCell">
                            <fieldset class="fieldset">
                                <legend>FormValidationGroup</legend>
                                <div class="divCity">
                                    <asp:Label Text="City:" ID="lblCity" AssociatedControlID="city" runat="server" />
                                    <telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="city"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator4" ControlToValidate="city"
                                        Display="Dynamic" ForeColor="Red" ErrorMessage="City is required" ValidationGroup="FormValidationGroup"
                                        Style="margin-left: 14px;"></asp:RequiredFieldValidator>
                                </div>
                                <div class="divState">
                                    <asp:Label Text="State:" ID="lblState" AssociatedControlID="state" runat="server" />
                                    <telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="state"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator5" ControlToValidate="state"
                                        Display="Dynamic" ForeColor="Red" ErrorMessage="State is required" ValidationGroup="FormValidationGroup"
                                        Style="margin-left: 5px;"></asp:RequiredFieldValidator>
                                </div>
                                <telerik:RadButton RenderMode="Lightweight" CausesValidation="true" runat="server" ID="Button1" Text="PostBack" ValidationGroup="FormValidationGroup"></telerik:RadButton>
                            </fieldset>
                        </td>
                        <td class="validationCell">
                            <fieldset class="fieldset">
                                <legend>SearchValidationGroup</legend>
                                <div class="searchDiv">
                                    <asp:Label Text="Enter criteria:" ID="lblName" AssociatedControlID="name" runat="server" />
                                    <telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="name"></telerik:RadTextBox>
                                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator3" ControlToValidate="name"
                                        Display="Dynamic" ForeColor="Red" ErrorMessage="Criteria is required" ValidationGroup="SearchValidationGroup"></asp:RequiredFieldValidator>
                                </div>
                                <telerik:RadButton RenderMode="Lightweight" ID="btnSearch" runat="server" Text="PostBack" ValidationGroup="SearchValidationGroup"></telerik:RadButton>
                            </fieldset>
                        </td>
                    </tr>
                </table>
            </div>
        </telerik:RadAjaxPanel>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString35 %>"
            DeleteCommand="DELETE FROM [Products] WHERE [ProductID] = @ProductID" InsertCommand="INSERT INTO [Products] ([ProductName], [SupplierID], [CategoryID], [QuantityPerUnit], [UnitPrice], [UnitsInStock], [UnitsOnOrder], [ReorderLevel], [Discontinued]) VALUES (@ProductName, @SupplierID, @CategoryID, @QuantityPerUnit, @UnitPrice, @UnitsInStock, @UnitsOnOrder, @ReorderLevel, @Discontinued)"
            SelectCommand="SELECT * FROM [Products]" UpdateCommand="UPDATE [Products] SET [ProductName] = @ProductName, [SupplierID] = @SupplierID, [CategoryID] = @CategoryID, [QuantityPerUnit] = @QuantityPerUnit, [UnitPrice] = @UnitPrice, [UnitsInStock] = @UnitsInStock, [UnitsOnOrder] = @UnitsOnOrder, [ReorderLevel] = @ReorderLevel, [Discontinued] = @Discontinued WHERE [ProductID] = @ProductID">
            <DeleteParameters>
                <asp:Parameter Name="ProductID" Type="Int32"></asp:Parameter>
            </DeleteParameters>
            <UpdateParameters>
                <asp:Parameter Name="ProductName" Type="String"></asp:Parameter>
                <asp:Parameter Name="SupplierID" Type="Int32"></asp:Parameter>
                <asp:Parameter Name="CategoryID" Type="Int32"></asp:Parameter>
                <asp:Parameter Name="QuantityPerUnit" Type="String"></asp:Parameter>
                <asp:Parameter Name="UnitPrice" Type="Decimal"></asp:Parameter>
                <asp:Parameter Name="UnitsInStock" Type="Int16"></asp:Parameter>
                <asp:Parameter Name="UnitsOnOrder" Type="Int16"></asp:Parameter>
                <asp:Parameter Name="ReorderLevel" Type="Int16"></asp:Parameter>
                <asp:Parameter Name="Discontinued" Type="Boolean"></asp:Parameter>
                <asp:Parameter Name="ProductID" Type="Int32"></asp:Parameter>
            </UpdateParameters>
            <InsertParameters>
                <asp:Parameter Name="ProductName" Type="String"></asp:Parameter>
                <asp:Parameter Name="SupplierID" Type="Int32"></asp:Parameter>
                <asp:Parameter Name="CategoryID" Type="Int32"></asp:Parameter>
                <asp:Parameter Name="QuantityPerUnit" Type="String"></asp:Parameter>
                <asp:Parameter Name="UnitPrice" Type="Decimal"></asp:Parameter>
                <asp:Parameter Name="UnitsInStock" Type="Int16"></asp:Parameter>
                <asp:Parameter Name="UnitsOnOrder" Type="Int16"></asp:Parameter>
                <asp:Parameter Name="ReorderLevel" Type="Int16"></asp:Parameter>
                <asp:Parameter Name="Discontinued" Type="Boolean"></asp:Parameter>
            </InsertParameters>
        </asp:SqlDataSource>
    </div>
    <qsf:ConfiguratorPanel ID="ConfiguratorPanel" runat="server" Expanded="true">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" Size="Narrow">
                    <asp:CheckBox ID="CheckBox1" Text="Allow multi-item edit"
                        AutoPostBack="True" runat="server" OnCheckedChanged="CheckBox1_CheckedChanged"></asp:CheckBox>
                    <br />
                    <asp:CheckBox ID="CheckBox2" AutoPostBack="True" Text="Validation Enabled"
                        runat="server" Checked="True" OnCheckedChanged="CheckBox2_CheckedChanged"></asp:CheckBox>
                </qsf:ConfiguratorColumn>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn2" runat="server" Size="Narrow">
                    <qsf:DropDownList ID="DropDownList1" runat="server" Label="Choose validation group" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                        <Items>
                            <telerik:DropDownListItem Text="No group chosen" Value="NoGroup" Selected="true" />
                            <telerik:DropDownListItem Text="FormValidationGroup" Value="FormGroup" />
                            <telerik:DropDownListItem Text="SearchValidationGroup" Value="SearchGroup" />
                        </Items>
                    </qsf:DropDownList>
                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?