CODEWITHSUNDEEP
javascriptjqueryvalidationteleriktelerik-datepicker
gene
gene

Reputation: 2108

How to use javascript to validate Telerik RadDatePicker for invalid dates entered?

I'm using two RadDatePicker controls showing Date From and Date To and need to make sure that before submitting the form, at least one of the date is provided.

I have a JavaScript code checking to make sure that the user provides at least one date value:

function validateDates(sender, eventArgs) {

    var datePicker1 = $find("<%=RadDatePicker1.ClientID %>");
    var datePicker2 = $find("<%=RadDatePicker2.ClientID %>");


    if (datePicker1.get_selectedDate() == null && datePicker2.get_selectedDate() == null) 
    {
        alert("At least one date should be selected");
        eventArgs.set_cancel(true);
    }

       //alert(datePicker1.lastSetTextBoxValue.value);
       //return false;
}

That part works.

However, a user can also type a string in which case, it will also fails with the same message, because get_selecteddate() method also returns null.

But, what I want is to actually check if the value entered is of a date format and display the corresponding message to the user.

So, in my case, I would need to use a validation for the correct date format as well.

I noticed that when Telerik DatePicker is rendered, it builds the following html sections:

<input id="ctl00_Contentplaceholder2_RadDatePicker1_dateInput" name="ctl00$Contentplaceholder2$RadDatePicker1$dateInput" class="riTextBox riError" type="text" style="">

<input id="ctl00_Contentplaceholder2_RadDatePicker1_dateInput_ClientState" name="ctl00_Contentplaceholder2_RadDatePicker1_dateInput_ClientState" type="hidden" autocomplete="off" value="{&quot;enabled&quot;:true,&quot;emptyMessage&quot;:&quot;&quot;,&quot;validationText&quot;:&quot;&quot;,&quot;valueAsString&quot;:&quot;&quot;,&quot;minDateStr&quot;:&quot;1980-01-01-00-00-00&quot;,&quot;maxDateStr&quot;:&quot;2099-12-31-00-00-00&quot;,&quot;lastSetTextBoxValue&quot;:&quot;hhh&quot;}">

From that html I see that when a string is entered into a DatePicker, its input element gets assigned a css class called riError and its lastSetTextBoxValue has a string I entered.

So, I can assume, I can use those two properties to improve my validation logic.

How can I do that? Any ideas?

Upvotes: 0

Views: 207

Answers (0)

Related Questions