This is a migrated thread and some comments may be shown as answers.

Problem validating date input

5 Answers 141 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
andieje
Top achievements
Rank 1
andieje asked on 30 Jun 2009, 09:45 AM
Hello

My page has 2 date pickers on it and I want to ensure that the second date is no more than 30 days after the first date. How would I do this? I have already looked at the validation demos on the website and they did not show me how to do it. If the information is in the demos and I have missed it, please don't refer me back to the demos without pinpointing where it is otherwise we'll be going round in circles as I can't see it. :)

Many thanks
andrea

5 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 30 Jun 2009, 01:03 PM
Hello Andrea,

One suggestion would be setting MaxDate property of second DatePicker to the date, which is after 30 days from date selected in first datepicker. See the client side code in order to achieve this functionality.

ASPX:
 
<telerik:RadDatePicker ID="RadDatePicker1" runat="server"
<ClientEvents OnDateSelected="OnDateSelected" /> 
</telerik:RadDatePicker> 
<br /> 
 
<telerik:RadDatePicker ID="RadDatePicker2" runat="server"
</telerik:RadDatePicker> 

JavaScript:
 
<script type="text/javascript"
function OnDateSelected(sender, eventArgs) 
    var date1 = sender.get_selectedDate(); 
    date1.setDate(date1.getDate()+30); 
    var datepicker = $find("<%= RadDatePicker3.ClientID %>"); 
    datepicker.set_maxDate(date1); 
</script> 

Thanks,
Shinu
0
andieje
Top achievements
Rank 1
answered on 30 Jun 2009, 03:17 PM
Hi

Thank-you for your reply. What you have suggested is a possibility but you get a problem with validator error messages then. As i am sure you know, if you enter an invalid date (including a date greater than the max date) into the rad date picker it triggers the required field validator associated with the control. This is a crazy design feature in my opinion which I remember talking to telerik about a while ago (http://www.telerik.com/community/forums/aspnet-ajax/calendar/problem-with-required-field-validator.aspx)
but gave up on. Anyway, the error message for my required field validator is 'date required' Naturally this doesn't tell the user the date they have entered is 30 days more than the first date.

You obviously know a lot about telerik controls so perhaps you could help me sort out the problem with the required field validator. It would be great to customise the message in teh validator depending on whether the rad date input was empty or had an invalid date (text or some date that can't exist) or a date above the max date.

Many thanks

0
andieje
Top achievements
Rank 1
answered on 01 Jul 2009, 08:08 PM
Hi

I would really appreciate it if someone from tech support could look at this question as I notice other questions posted after this one have already been answered.

I could follow the solution as suggested by shinu to set the max date of the second date picker in javascript but I am then left with the problem that my required field validator for the second date picker says date required and i need it to say something like 'date must be within 30 days of 1st date'

Many thanks in advance
0
Shinu
Top achievements
Rank 2
answered on 02 Jul 2009, 10:09 AM
Hi,

I hope following approach will be suitable for you which alerts user when selected date is more than 30 days from the date value of first datepicker and RequireFieldValidator shows message when second DatePicker is empty. Give a try with this.

ASPX:
 
<telerik:RadDatePicker ID="RadDatePicker1" runat="server"
</telerik:RadDatePicker> 
 
<telerik:RadDatePicker ID="RadDatePicker2" runat="server"
    <ClientEvents OnDateSelected="OnDateSelected" /> 
</telerik:RadDatePicker> 
 
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="RadDatePicker2" ErrorMessage="RequiredFieldValidator"
</asp:RequiredFieldValidator> 

JavaScript:
 
<script type="text/javascript"
function OnDateSelected(sender, eventArgs) 
    var d1 = new Date(); 
    var d2 = new Date(); 
    d1 = sender.get_selectedDate(); 
    if(d1 != null
    {  
        d1 = d1.localeFormat('yyyy/MM/dd'); 
        var datepicker = $find("<%= RadDatePicker1.ClientID %>"); 
        d2 = datepicker.get_selectedDate(); 
        d2.setDate(d2.getDate()+30); 
        d2 = d2.localeFormat('yyyy/MM/dd');    
        if(d1 > d2) 
        { 
            alert("Date must be within 30 days of 1st date !"); 
            sender.clear(); 
        }         
    } 
</script> 

-Shinu
0
andieje
Top achievements
Rank 1
answered on 07 Jul 2009, 10:20 PM
Hi Shinu

I really really appreciate the fact you have come up with a solution for me.  You obviously know the telerik controls inside out so a I am assuming that the fact you have used an alert rather than changing the error message displayed in the required field validator means that it is not possible in javascript to detect whether a date picker has either
a) nothing entered
b) an invalid date
c) a date that breaks any min/max date rules
and then customise the message in teh required field validator

This is my ideal solution. Is this possible or is the alert option (which i trulu appreciate) the only think you can do?

many thanks
Tags
Calendar
Asked by
andieje
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
andieje
Top achievements
Rank 1
Share this question
or