RadDatePicker validation

[Ratna Koneru]

Is there a way to suppress the validation fired by RadDatePicker when an invalid date(13/13/2001) is entered and display the error message from a custom validator? Basically, I just want to show the error message from custom validator and don't want to show the information icon that RadDatePicker usually shows when an invalid date is entered.

[Mira]

Hi Ratna,

I am attaching a sample project I made for you in which OnValueChanging client event of the DateInput of the RadDatePicker is handled. On invalid user input custom message is displayed and the event is canceled.

Please take a look at it and tell me whether you find it useful.

Regards,
Mira
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Ratna Koneru]

Hi Mira,
       Thanks for the sample. I tried the code you sent. It still behaves the same way when an invalid date (13/13/2001) is keyed. The other difference I saw is if you key in a date (010101 or 01012001 for 01/01/2001) it shows it as invalid because of parsing. The date is supposed to be Valid. Also, at this point the validation of the datepicker doesn't fire and only the error message shows up, which is what I was looking for even in case we enter 13/13/2001.

Thanks,
Sunil Koneru

[Mira]

Hi Ratna,

Thank you for the further clarifications.

To achieve the desired by you functionality I recommend that you use the build-in validation of the RadDatePicker and handle the OnError client event. In its event handler you can display the custom error message and cancel the event.

I am also attaching a sample project showing how this works. I hope you will find it useful.

Best wishes,
Mira
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Ratna Koneru]

The solution worked. Thanks.

[Ratna Koneru]

One more question related to DatePicker validation, Is there a way we can retain the value entered without using javascript? Is there a property like RetainValue (or something like that) which will retain the invalid value entered, when 'OnError' event triggers, with the same behaviour as mentioned before?

Thanks,
Sunil

[Mira]

Hi Ratna,

Note the DateInput value is set only in case of valid input. In case of invalid input the OnError client-side event is fired and the DateInput/DatePicker value is left unchanged. Therefore you can get the invalid input in the OnError client-side event handler only and use it as per your requirements further.

Best wishes,
Mira
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[M Givi]

thanks. It worked for me.

[Peter Livsey]

Is there a property that can be set on the RadDatePicker to stop the validation event firing? If possible I'd rather not rely on using Javascript in the ClientEvents to stop the override the default validation by doing 'eventArgs.set_cancel(true);'

Peter

[Mira]

Hello Peter,

You can use the following code in order to cancel the OnError event and make the picker keep the old date (the last one valid):

<telerik:RadDatePicker ID="RadDatePicker1" runat="server">
    <DateInput ClientEvents-OnError="HandleError">
    </DateInput>
</telerik:RadDatePicker>
<script type="text/javascript">
    function HandleError(sender, eventArgs) {
        eventArgs.set_cancel(true);
    }
</script>

I hope this helps.

Best wishes,
Mira
the Telerik team

[Sophie]

Hello,
I'm having some issue with this OnError function in Javascript. This thread helped me solve the problem but i don't feel this is the right way to solve it. Let me know what you think.
I have this code in my DateInput-ClientEvents-OnError Javascript function:

function OnDateError(sender, eventArgs)
{
    eventArgs.set_cancel(true);
    //Some button.set_enabled(false);
}

The issue i'm having occurs when I:
1. Choose a valid date in my Calendar.
2. Then erase it by typing "some random letters to trigger the error event".
3. Then, this line: _setCalendarDate:function(a){var c=[a.getFullYear(),a.getMonth()+1,a.getDate()];
4. Error : Microsoft JScript runtime error: 'null' is null or not an object (a is null here)

My question is why is the control call the setCalendarDate ? I'm only disabling my button. And i checked every function that i have, none of them are called so it is not my code that triggers that setCalendarDate. (Note: i have no postback with those controls.)
The solution i came up with is to call

sender.clear();

Is it the best solution?


Thanks.
Sophie.

[Martin]

Hello Sophie,

Since some of the posts in this thread are quite old now, I would suggest that you verify whether the issue exists with the latest version of the product. Note that our developers have fixed many issues in the RadDateInput component in the recent releases and that issue may not be valid anymore.

In case you can observe it with the latest release, please send some runnable code snippets that I could debug locally. This way I will be able to provide more to the point resolution.

Regards,
Martin
the Telerik team

[levs]

Hello Mira, 

Is it possible to remove the client validation and retain the input date not return to last valid date for same solution you mentioned below:

You can use the following code in order to cancel the OnError event and make the picker keep the old date (the last one valid):

<telerik:RadDatePicker ID="RadDatePicker1" runat="server">

    <DateInput ClientEvents-OnError="HandleError">

    </DateInput>

</telerik:RadDatePicker>

<script type="text/javascript">

    function HandleError(sender, eventArgs) {

        eventArgs.set_cancel(true);

    }

</script>

[Martin]

Hello levs,

I am not quite sure that I understand your scenario. Note that the picker does not return to last valid date. Instead it just cancels the new selection because it is invalid. Since there is not new valid selected date, it is the previous selected date that does not change. In case you want to clear it you use the client-side clear method:

<script type="text/javascript">
    function HandleError(sender, eventArgs)
    {
        eventArgs.set_cancel(true);
        sender.clear();
    }
</script>

I hope this helps.

Regards,
Martin
the Telerik team

[levs]

Hi Martin,

Thanks for immediate reply.

Basically, what I'm trying to do is to validate the input at server side (at button click for example).
Although the min and max date are set, is it still possible to remove the client validation and retain
whatever the input? (returned to last valid input or clearing the input is not an option for my situation)  

Anyway, if not. What I did at below codes is set the input to min or max date if the input is out of range.
It's working for some pages, but I got the attached error when I used the same codes at my header page.
<script type="text/javascript">
 function OnOutOfRange(sender, args)
        {
            if (args.get_reason() == Telerik.Web.UI.InputErrorReason.OutOfRange)
            {
                var inputDate = new Date(args._inputText);
                var minValue = new Date(sender.get_minDateStr()).format("dd-MM-yyyy");
                var maxValue = new Date(sender.get_maxDateStr()).format("dd-MM-yyyy");
                if (inputDate > sender._maxDate)
                {
                    sender.set_value(maxValue);
                }
                else
                {
                    sender.set_value(minValue);
                }

                args.set_cancel(true);
                return;
            }
            else
            {
                args.set_cancel(true);
                return;
            }
        }
</script>
------------
<Telerik:RadDatePicker ID="DateFrom" runat="server" >
     <DateInput>
        <ClientEvents OnError="OnOutOfRange" />
    </DateInput>
</Telerik:RadDatePicker>

 Thanks for your help.

Regards,

Levs

[Martin]

Hello Levs,

There is no need to remove the client validation in order to get the invalid date input value on the server. You can use the RadDateInput's InvalidTextBox value instead:

protected void Page_Load(object sender, System.EventArgs e)
{
    Label1.Text = RadDatePicker1.DateInput.InvalidTextBoxValue;
}

I hope this helps.

Regards,
Martin
the Telerik team

[levs]

Hi Martin,

What I need is to display this invalid value in the Raddatepicker Date Input without the client validation. 
Just allow them to display like normal value even the min or max are set.

Thanks and Regards,

Levy

[Martin]

Hello Levy,

I am afraid that it is not possible to disable the client side validation logic. However you can use the client side API to achieve your goal. The trick is to cancel the error and then reset the erroneous value back. Since the set_value method accepts only valid dates you will have to use set_textBoxValue instead:

<script type="text/javascript">
            function MyError(sender, args)
            {
                args.set_cancel(true);
                setTimeout(function () { MyDelay(sender,args) }, 1);
            }
            function MyDelay(s,a)
            {
                s.set_textBoxValue(a.get_inputText());
            }
        </script>

    <telerik:RadDatePicker runat="server" ID="RadDatePicker1">
        <DateInput>
            <ClientEvents OnError="MyError" />
        </DateInput>
    </telerik:RadDatePicker>

I hope this helps.

All the best,
Martin
the Telerik team