Default date format of Javascript/Jquery

Question

I have a kendo date picker which is set to format date as "MM/dd/yyyy". I want to check using jquery/javascript that if kendo date picker date must not be future date and date must be greater than '01/01/1900'.

The issue I am facing is when I take new date in script, it is like Date {Tue Jun 10 2014 11:17:48 GMT+0530 (India Standard Time)}. and my kendo date picker has value in 06/02/2012 format. I don't know how to compare it.

I know a method in kendo date picker named: parseFormats in which I have to give parsing format, but I don't know defualt date format of Javascript/Jquery and I don't know how to do it.

Kendo Date Picker

@(Html.Kendo().DatePickerFor(m => m.DateOfBirth).Format("MM/dd/yyyy").HtmlAttributes(new { style = "width:100%", Placeholder = "mm/dd/yyyy" }).Max(DateTime.Now.Date).Min(new DateTime(1900, 1, 2).Date))

Answer 1

You are getting the toString value of the new Date. Try this

var d = new Date(datepicker.value()); // looked at the docs, no obvious shortcut
if (d.getFullYear()<1900) alert("nope");

or

var now = new Date(), d = new Date(datepicker.value());
now.setHours(0,0,0,0); // normalise
if (d.getTime() > now.getTime()) alert("Please no future dates");

More information about JS Dates: MDN

You can also make it harder to select the invalid dates

$("#datetimepicker").kendoDateTimePicker({
  value:new Date(),
  min: new Date(1900,0,1), // JS months are 0 based!
  max: new Date()
});

And lastly add the validation

$("#MyForm").kendoValidator({
  rules: {
    //implement your custom date validation
    dateValidation: function (dateField) {
        var currentDate = Date.parse($(dateField).val());
        //Check if Date parse is successful
        if (!currentDate) {
            return false;
        }

        var now = new Date(), then=new Date(1900,0,1),d = new Date($(dateField).val());
        now.setHours(0,0,0,0); // normalise
        return d.getTime() >= then.getTime() && d.getTime() < now.getTime()  
    }
  },
  messages: {
    //Define your custom validation massages
    required: "Date is required message",
    dateValidation: "Invalid date message"
  }
});

Answer 2

Default Date Format of Javascript is MM/DD/YYYY

For Reference Follow Date Format

Answer 3

I would pretty much ignore Kendo's methods altogether and use moment.js in a validation function when you submit. You can format each date, min, max, and candidate, as YYYY-MM-DD, then compare using built-in .isAfter() and .diff() queries. Remember that you have to account for if they type something, not just pick it from the calendar, so you have to ensure you have 2-digit days. You also have to account for if someone enters in something outrageous that is higher than the Kendo control can deal with, like 1/1/0001 and 1/1/9000. Code below deals with that. You may also - though I did not include it here in my code, but did in my fiddle - want to account for if the year is only 2-digits, as well:

$('#btnValidate').click(function(){
     var minDate = moment('1900-1-1');
     var maxDate = moment(Date.parse(new Date()));

     //var dateField = $("#datepicker").data("kendoDatePicker").value();
     var dateField = $("#datepicker").val();

     // Moment requires YYYY-MM-DD
     dateField = dateField.replace('/','-').replace('/','-');
     var year = dateField.split('-')[2];
     var month = dateField.split('-')[0];
     var day = dateField.split('-')[1];

     if (month < 10 && month.toString().length == 1) { month = "0" + month; }
     if (day < 10 && day.toString().length == 1) { day = "0" + day; }
     dateField = year + '-' + month + '-' + day;

     // Enter into moment and compare
     var dateToConsider = moment(dateField);
     var lowerLimitBreached = dateToConsider.diff(minDate) < 0;
     var upperBoundBreached = dateToConsider.isAfter(maxDate);

     alert('min: ' + moment(minDate).format('MM/DD/YYYY'));
     alert('max: ' + moment(maxDate).format('MM/DD/YYYY'));
     alert('our candidate: ' + moment(dateToConsider).format('MM/DD/YYYY'));

     if(lowerLimitBreached || upperBoundBreached)
         alert('Invalid date');
     else
         alert('Valid date');
 });

http://jsfiddle.net/navyjax2/k5xx9xpu/

Note that the example doesn't show using times, but you could add that if you got the time from the .data("kendoDatePicker").value commented-out line. I just would not trust the year since "0001" will translate as "1901". So I would say that appending the time to the dateField object would be the way to go, and you can hard-code the time on it like moment(year + '-' + month + '-' + day + 'T' + hours + ':' + mins + ':' + secs + 'Z').utc() and the min like moment('1900-1-1T00:00:00Z'), though 00:00:00Z is already implied if you do not set it.

Answer 4

You can use KendoUI's datepicker method as shown below:

  var datepicker = $("#datepicker").data("kendoDatePicker");
  var value = datepicker.value();

Here value will be holding value like Tue Oct 11 2015 11:17:48 GMT+0530 (India Standard Time)

Now you can use simple condition to compare values

EDIT

You can refer demo at this fiddle

Once you have javascript date format you can use condition to compare dates, as I have in demo code