Time picker validation using compare validator

5 posts, 0 answers
  1. Karthick Purushothaman
    Karthick Purushothaman avatar
    23 posts
    Member since:
    Mar 2009

    Posted 27 Nov 2009 Link to this post

    Greetings,

    I have a problem with comparing the time values in a time pickers using a compare validator. When the form loads with an existing value (e.g 10:00AM & 8: AM in two time pickers) the second time picker should be validated to have a greater time value than the first one. In a new form if we add the time, the validation fires, but not consistently. The validations should be checked on a button click.

    Please lend your helping hand.

    Thanx in advance.

    regards

  2. Johny
    Johny avatar
    80 posts
    Member since:
    Aug 2008

    Posted 30 Nov 2009 Link to this post

    Hi Karthick,

    I think that you can find this documentation article helpful:

    http://www.telerik.com/help/aspnet-ajax/calendar_webpagesvalidation.html

    These demos also provide details about using the picker control with compare validators:

    http://demos.telerik.com/aspnet-ajax/calendar/examples/datepicker/validation/defaultcs.aspx
    http://demos.telerik.com/aspnet-ajax/calendar/examples/design/sunny/defaultcs.aspx

    I hope this helps.
    Johny



  3. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 30 Nov 2009 Link to this post

    Hi Karthik,

    One more suggestion to achieve this functionality. If you want to check for validation when clicking the button, then you could use CustomValidator instead of CompareValidator. Here is the example that I tried to achieve the scenario.

    ASPX:
     
        <telerik:RadTimePicker ID="Start" runat="server"
        </telerik:RadTimePicker> 
        <telerik:RadTimePicker ID="End" runat="server"
        </telerik:RadTimePicker> 
        <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="The second time must be after the first one." 
            ClientValidationFunction="ClientValidationFunction"></asp:CustomValidator> 
     
        <asp:Button ID="Button2" runat="server" Text="Update" /> 

    JavaScript:
     
    <script type="text/javascript"
        function ClientValidationFunction(sender, args) { 
            var start = $find("<%= Start.ClientID %>"); 
            var end = $find("<%= End.ClientID %>"); 
            var date1 = new Date(); 
            date1 = start.get_selectedDate(); 
            var date2 = new Date(); 
            date2 = end.get_selectedDate(); 
            if (date1 > date2) { 
                args.IsValid = false
            } 
        } 
    </script> 

    Hope this helps,
    Shinu.
  4. biseptol
    biseptol avatar
    1 posts
    Member since:
    Oct 2012

    Posted 30 Nov 2009 Link to this post

    Hi Karthik,

    One more suggestion :

    •    Disable client script on CompareValidator - EnableClientScript="False"
    •    Call Validate method on Page in Page_Load event
    •    Call Validate method on Page in Button_Click event

    How does this work  :

    When your page is loaded, if the value of the second RadTimePicker is not greater than the value of the first, validation will fire. – this solve your first problem - When the form loads with an existing value (e.g 10:00AM & 8: AM in two time pickers) the second time picker should be validated to have a greater time value than the first one.

    When you turn off client script validation EnableClientScript="False" the hole javascript validation is disabled, that means you have only server side validation. Then you could validate controls when button was pressed. – this solve your second problem - The validations should be checked on a button click event.

    ASPX:

    <telerik:RadDateTimePicker ID="RadTimePickerFirst" SelectedDate="5/11/2009" runat="server"></telerik:RadDateTimePicker> 
    <telerik:RadDateTimePicker ID="RadTimePickerSecond" SelectedDate="2/11/2009" runat="server"></telerik:RadDateTimePicker> 
    <asp:CompareValidator ID="CompareValidatorDatePickers" ControlToCompare="RadTimePickerFirst" ControlToValidate="RadTimePickerSecond" runat="server" Operator="GreaterThan" ErrorMessage="The second date must be grater than the first!" ValidationGroup="myGroup" EnableClientScript="False"></asp:CompareValidator> 
    <asp:Button ID="ButtonPostback" runat="server" ValidationGroup="myGroup" Text="Postback" /> 

    ASPX.CS

    protected override void OnInit(EventArgs e) 
          base.OnInit(e); 

          ButtonPostback.Click += new EventHandler(ButtonPostback_Click); 
     
    void ButtonPostback_Click(object sender, EventArgs e) 
          Page.Validate(); 
     
    protected override void OnLoad(EventArgs e) 
          base.OnLoad(e); 
     
          if (RadTimePickerFirst.SelectedDate.Value > RadTimePickerSecond.SelectedDate.Value) 
          { 
              Page.Validate(); 
          } 


    I hope this helps,
    Biseptol
  5. brian
    brian avatar
    23 posts
    Member since:
    Aug 2008

    Posted 12 Oct 2011 Link to this post

    Shinu, thanks for that snippet with JavaScript and CustomValidator, it helped me.
Back to Top