I am using date picker and time picker separately in my vue.js code. My datepicker and time picker are giving me values as:

date = "2018-01-19T00:00:00.000Z"
time = "2018-05-20T00:06:30.000Z

Both date and time are of object form, from these I want to create a new object like so:

dataTime = "2018-01-19T00:06:30.000Z"

How to create this and then convert it to ISO string format?

I am using date picker and time picker separately in my vue.js code. My datepicker and time picker are giving me values as:

date = "2018-01-19T00:00:00.000Z"
time = "2018-05-20T00:06:30.000Z

Both date and time are of object form, from these I want to create a new object like so:

dataTime = "2018-01-19T00:06:30.000Z"

How to create this and then convert it to ISO string format?

• javascript
• momentjs

• 1. Concatonating a string has nothing to do with Vue, it's a function of Javascript. 2. Take time to format your posts if you want people to help you. – Richard Vanbergen Commented Jan 23, 2018 at 9:50
• yes @Richard Vanbergen is right you can use moment.js concatenating string – ashishdudhat Commented Jan 23, 2018 at 10:13

5 Answers 5

You can use date-fns as follows:

import {formatISO} from 'date-fns';

const date = new Date();
const time = new Date();
const newDate = formatISO(date, {representation: 'date'});
const newTime = formatISO(time, {representation: 'time'});
const dateTime = `${newDate}T${newTime}`

You can use momentjs (http://momentjs./):

var date = moment(dateObject).format("YYYY-MM-DD");
var time = moment(dateObject).format("HH:mm:ss");

You can do it in plain Javascript, no need for a library like moment.js.

Here is a verbose example it can be simplified...

getDateTime($d,$t){
   let date = $d; //i.e. "2018-01-19T00:00:00.000Z";
   let time = $t; //i.e. "2018-05-20T00:06:30.000Z";

   date = date.split('T').slice(0,1);
   time = time.split('T').slice(1);

   return date + 'T' + time;
}

Most answers here do not take daylight savings into account. Concatenating date and time with T will give you an incorrect result if the date and time are not in the same daylight savings rule. Your time will be an hour off, depending on the timezone rules. Here's a simple way to avoid daylight savings issues:

const mergeDateAndTime = (date, time) => {
  const newDate = new Date(date);

  newDate.setHours(time.getHours());
  newDate.setMinutes(time.getMinutes());
  newDate.setSeconds(time.getSeconds());
  newDate.setMilliseconds(0);

  return newDate;
};

You could use moment.js:

var firstvar="2018-01-19T00:00:00.000Z";
var secondvar="2018-05-20T00:06:30.000Z";
var thirdvar=moment(firstvar).format("YYYY-MM-DD") + moment(secondvar).format("THH:mm:ssZ");

You split the datetime objects on date and time first, and then connecting it together the thirdvar will result in 2018-01-19T00:06:30.000Z