简体   繁体   中英

How to format javascript date object?

i have 2 date fields which i want to compare their values. The problem is that i need the dates to be in dd/mm/yyyy format and as js date object. How can i change the date object format to receive dd/mm/yyyy and compare them with this format?

Here is what i've tried so far...

$('#date_customFrom').datepicker({
format: "dd/mm/yyyy"
  });
$('#date_customTo').datepicker({
format: "dd/mm/yyyy"
  });

$('.submit').on('click', function() {

 var start_date = $("input[name='date_customFrom']").val().split("/");
 var end_date = $("input[name='date_customTo']").val().split("/");

 var new_date_start = new Date(start_date[2], start_date[1] - 1, 
 start_date[0]);
 var new_date_end = new Date(end_date[2], end_date[1] - 1, end_date[0]);

 console.log(new_date_start);
 console.log(new_date_end);

});

fiddle

 var dd = new_date_start.getDate();
    var mm = new_date_start.getMonth() + 1;//January is 0! 
    var yyyy = new_date_start.getFullYear();
    if (dd < 10) { dd = '0' + dd }
    if (mm < 10) { mm = '0' + mm }
     var res_START= dd + '/' + mm + '/' + yyyy;
 console.log(res_START);

TRY THIS

You need use Moment.js

Here is doc

var momDt = moment('10.12.2016', 'DD/MM/YYYY');

You can compare Date objects with basic relational operators.

Make sure you are converting to numbers after splitting the string, using + or parseInt ;

+(start_date[2]) 
Number(start_date[2])
parseInt(start_date[2], 10)

or map Number constructor after splitting

var start_date = $("input[name='date_customFrom']").val().split("/").map(Number);

new Date(start_date[2], start_date[1] - 1,  start_date[0]);

Use < , <= , > , >= to compare now.

 var start, end; start = new Date(2016, 11, 5); end = new Date(2016, 11, 4); console.log(start, end, start < end) start = new Date(2016, 11, 3); end = new Date(2016, 11, 4); console.log(start, end, start < end) 

Fist of all, you do not need to cast the dates... the datepicker already can give you dates:

var start_date = $("#date_customFrom").datepicker('getDate');
var end_date = $("#date_customTo").datepicker('getDate');

Second, the correct format of the date is the date picker is

$('#date_customFrom').datepicker({
     dateFormat: "dd/mm/yyyy"
});

Check this for the entire list of formats

http://api.jqueryui.com/datepicker/#utility-formatDate

Third, comparison is simply using relational comparison

if (start_date > end_date) {
}

You can create a format function:

function formatDate(date, search, replacement)
{
    var target = date.toISOString().slice(0, 10);
    return target.split(search).join(replacement);
}

and use it:

formatDate(new_date_start, "-", "/")

Here is your updated fiddle

But I agree with asdf_enel_hak 's comment that moment.js would be a much better solution for you.

Update

I've just realized that the above will not take into consideration your timezone, so here is an updated function:

function formatDate(date, search, replacement)
{
    var target = new Date(date);
    target.setMinutes(date.getMinutes() - date.getTimezoneOffset());
    target = target.toJSON().slice(0, 10);
    return target.split(search).join(replacement);
}

And new fiddle

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM