Forums Retired Products and Controls
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Ryan Garaygay
405
Enforce Valid Date Range for my two WebDateChooser controls
posted

I have two WebDataChooser controls:

1. Start Date

2. End Date

Now, I want some client side validation to ensure that my end date is not earlier than my start date. How do I do this? Is there any support for ASP.NET Validators (or at least free validators). Otherwise can you suggest any other solution?

  • 28407
    posted

    Hi, You can use a requiredfield validator and some client-side code.

    Here is a small crude page i put together to validate the start and end dates

    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

    <%@ Register Assembly="Infragistics2.WebUI.WebDateChooser.v7.2, Version=7.2.20072.61, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb"
        Namespace="Infragistics.WebUI.WebSchedule" TagPrefix="igsch" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>

       

       

       

        <script id="igClientScript" type="text/javascript">
    <!--
    var odate1 = null;
    var odate2 = null;

    function WebDateChooser1_ValueChanged(oDateChooser, newValue, oEvent){
     //Add code to handle your event here.
     debugger;
     var d1 = odate1.getValue();
     var d2 = odate2.getValue();
     if (d2 != null)
      {
        if (d1 > d2)
        {
          odate2.setValue(null);
          alert("bad date");
        }
      }
    }

    function WebDateChooser2_ValueChanged(oDateChooser, newValue, oEvent){
     //Add code to handle your event here.
     debugger;
     var d1 = odate1.getValue();
     var d2 = odate2.getValue();
     if (d2 < d1)
     {
    // alert (d2)
     alert("bad date" + d2);
     odate2.setValue(null);
     }
    }

    function WebDateChooser1_InitializeDateChooser(oDateChooser){
     //Add code to handle your event here.
     odate1 = oDateChooser;
    }

    function WebDateChooser2_InitializeDateChooser(oDateChooser){
     //Add code to handle your event here.
     odate2 = oDateChooser;
    }
    // -->
    </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <igsch:WebDateChooser ID="WebDateChooser1" runat="server">
                <ClientSideEvents ValueChanged="WebDateChooser1_ValueChanged" InitializeDateChooser="WebDateChooser1_InitializeDateChooser" />
            </igsch:WebDateChooser>
            <igsch:WebDateChooser ID="WebDateChooser2" runat="server">
                <ClientSideEvents ValueChanged="WebDateChooser2_ValueChanged" InitializeDateChooser="WebDateChooser2_InitializeDateChooser" />
            </igsch:WebDateChooser>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="WebDateChooser1"
                ErrorMessage="RequiredFieldValidator start date needed"></asp:RequiredFieldValidator>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="WebDateChooser2"
                ErrorMessage="RequiredFieldValidator end date needed"></asp:RequiredFieldValidator>
            <asp:Button ID="Button1" runat="server" Text="Button" /></div>
        </form>
    </body>
    </html>