CODEWITHSUNDEEP
javascriptmomentjsdate-parsing
Warz
Warz

Reputation: 7746

Format date with Moment.js

I have a string in this format:

var testDate = "Fri Apr 12 2013 19:08:55 GMT-0500 (CDT)"

I would like to use Moment.js get it in this format mm/dd/yyyy : 04/12/2013 for display.

I tried to do it using this method,

moment(testDate,'mm/dd/yyyy');

Which errors and says there is no such method called replace? Am I approaching this in the wrong way?

Edit

I should also mention that I am using a pre-packaged version of Moment.js, packaged for Meteor.js

Object [object Date] has no method 'replace' : The Exact error from the console

Stack Trace:

 at makeDateFromStringAndFormat (http://127.0.0.1:3000/packages/moment/lib/moment/moment.js?b4e3ac4a3d0794023a4410e7941c3e179398b5b0:539:29)
    at moment (http://127.0.0.1:3000/packages/moment/lib/moment/moment.js?b4e3ac4a3d0794023a4410e7941c3e179398b5b0:652:24)
    at populateProfileForEdit (http://127.0.0.1:3000/client/views/home/administration/directory/profiles/profiles.js?acfff908a6a099f37312f62892a22b40f82e5e0f:147:25)
    at Object.Template.profile_personal.rendered (http://127.0.0.1:3000/client/views/home/administration/directory/profiles/profiles.js?acfff908a6a099f37312f62892a22b40f82e5e0f:130:13)
    at Spark.createLandmark.rendered (http://127.0.0.1:3000/packages/templating/deftemplate.js?b622653d121262e50a80be772bf5b1e55ab33881:126:42)
    at http://127.0.0.1:3000/packages/spark/spark.js?45c746f38023ceb80745f4b4280457e15f058bbc:384:32
    at Array.forEach (native)
    at Function._.each._.forEach (http://127.0.0.1:3000/packages/underscore/underscore.js?867d3653d53e9c7a171483edbcad9670e12288c7:79:11)
    at http://127.0.0.1:3000/packages/spark/spark.js?45c746f38023ceb80745f4b4280457e15f058bbc:382:7
    at _.extend.flush (http://127.0.0.1:3000/packages/deps/deps.js?9642a93ae1f8ffa8eb1c2475b198c764f183d693:231:11)

Upvotes: 396

Views: 1240945

Answers (10)

Jonathan Lonowski
Jonathan Lonowski

Reputation: 123423

The 2nd argument to moment() is a parsing format rather than a display format.

To format a date, you want the .format() method:

moment(testDate).format('MM/DD/YYYY');

Also note that case does matter. For Month, Day of Month, and Year, the format should be uppercase.

Upvotes: 813

Talha
Talha

Reputation: 880

moment is a JavaScript library used to manipulate, validate, parse and display dates and times in JavaScript.

Here are common function that used in a project

var now = moment();

let date = "2024-03-29T19:33:36.411Z"; 

const dateTimeUs = incomingDate => {
  return moment(incomingDate).format('MMM DD, YYYY hh:mm:ss A');
};
console.log("dateTimeUs => ", dateTimeUs(date));

const dateSimplewithSlashes = incomingDate => {
  return moment(incomingDate).format('YYYY/MM/DD');
};
console.log("dateSimplewithSlashes => ", dateSimplewithSlashes(date));

const dateSimplewithDashes = incomingDate => {
  return moment(incomingDate).format('YYYY-MM-DD');
};
console.log("dateSimplewithDashes => ", dateSimplewithDashes(date));

const ReversedateSimplewithDashes = incomingDate => {
  return moment(incomingDate).format('DD-MM-YYYY');
};
console.log("ReversedateSimplewithDashes => ", ReversedateSimplewithDashes(date));

const dateUSWithAlphaMonth = incomingDate => {
  return moment(incomingDate).format('DD MMM YYYY');
};
console.log("dateUSWithAlphaMonth => ", dateUSWithAlphaMonth(date));

const getOnlyMonth = incomingDate => {
  return moment(incomingDate).format('MMMM');
};
console.log("getOnlyMonth => ", getOnlyMonth(date));

const getOnlyDate = incomingDate => {
  return moment(incomingDate).format('DD');
};
console.log("getOnlyDate => ", getOnlyDate(date));

const dateTimeFromNow = incomingDate => {
  return moment(incomingDate).fromNow();
};
console.log("dateTimeFromNow => ", dateTimeFromNow(date));

const dateSimplewithComma = incomingDate => {
  return moment(incomingDate).format('MMM DD, YYYY');
};
console.log("dateSimplewithComma => ", dateSimplewithComma(date));

const currentTime = incomingTime => {
  return moment(incomingTime).format('hh:mm A');
};
console.log("currentTime => ", currentTime(date));

const MonthNdDate = incomingTime => {
  return moment(incomingTime).format('MMMM DD');
};
console.log("MonthNdDate => ", MonthNdDate(date));

const getOnlyTime = incomingTime => {
  return moment(incomingTime).format('hh:mm A');
};
console.log("getOnlyTime => ", getOnlyTime(date));
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

Upvotes: 0

Manish
Manish

Reputation: 667

To get the current UTC time in YYYY-MM-DD HH:MM:ss.Millisecond with timezone using moment format as below

moment().utc().format('Y-MM-DD HH:mm:ss.SSS Z').

Output

2022-09-20 15:28:39.446 +0000

Upvotes: 4

Dunc
Dunc

Reputation: 18922

You can pass "L" to format method, which handles internationalisation...

moment.locale('en-US');
moment().format("L");
> "06/23/2021"

moment.locale('fr');
moment().format("L");
> "23/06/2021"

Other long date formats (fr locale):

LT : 'HH:mm',
LTS : 'HH:mm:ss',
L : 'DD/MM/YYYY',
LL : 'D MMMM YYYY',
LLL : 'D MMMM YYYY HH:mm',
LLLL : 'dddd D MMMM YYYY HH:mm'

Docs: https://momentjs.com/docs/#/displaying/format/ (see "Localized formats")

Upvotes: 5

Shashwat Gupta
Shashwat Gupta

Reputation: 5264

var moment = require('moment');

let yourdate = '2021-01-02T07:57:45.121Z'; // for example

moment(yourdate).format('MM/DD/YYYY');

// output : 01-02-2021


moment(yourdate).format('DD-MMM-YYYY');

// output : 01-Jan-2021

Upvotes: 15

t_dom93
t_dom93

Reputation: 11456

You Probably Don't Need Moment.js Anymore

Moment is great time manipulation library but it's considered as a legacy project, and the team is recommending to use other libraries.

date-fns is one of the best lightweight libraries, it's modular, so you can pick the functions you need and reduce bundle size (issue & statement).

Another common argument against using Moment in modern applications is its size. Moment doesn't work well with modern "tree shaking" algorithms, so it tends to increase the size of web application bundles.

import { format } from 'date-fns' // 21K (gzipped: 5.8K)
import moment from 'moment' // 292.3K (gzipped: 71.6K)

Format date with date-fns:

// moment.js
moment().format('MM/DD/YYYY');
// => "12/18/2020"

// date-fns
import { format } from 'date-fns'
format(new Date(), 'MM/dd/yyyy');
// => "12/18/2020"

More on cheat sheet with the list of functions which you can use to replace moment.js: You-Dont-Need-Momentjs

Upvotes: 23

Prabha
Prabha

Reputation: 273

May be this helps some one who are looking for multiple date formats one after the other by willingly or unexpectedly. Please find the code: I am using moment.js format function on a current date as (today is 29-06-2020) var startDate = moment(new Date()).format('MM/DD/YY'); Result: 06/28/20

what happening is it retains only the year part :20 as "06/28/20", after If I run the statement : new Date(startDate) The result is "Mon Jun 28 1920 00:00:00 GMT+0530 (India Standard Time)",

Then, when I use another format on "06/28/20": startDate = moment(startDate ).format('MM-DD-YYYY'); Result: 06-28-1920, in google chrome and firefox browsers it gives correct date on second attempt as: 06-28-2020. But in IE it is having issues, from this I understood we can apply one dateformat on the given date, If we want second date format, it should be apply on the fresh date not on the first date format result. And also observe that for first time applying 'MM-DD-YYYY' and next 'MM-DD-YY' is working in IE. For clear understanding please find my question in the link: Date went wrong when using Momentjs date format in IE 11

Upvotes: 2

Avinash Sharma
Avinash Sharma

Reputation: 653

moment().format();                                // "2019-08-12T17:52:17-05:00" (ISO 8601, no fractional seconds)
moment().format("dddd, MMMM Do YYYY, h:mm:ss a"); // "Monday, August 12th 2019, 5:52:00 pm"
moment().format("ddd, hA");                       // "Mon, 5PM"

Upvotes: 44

Kamil Kiełczewski
Kamil Kiełczewski

Reputation: 92347

For fromating output date use format. Second moment argument is for parsing - however if you omit it then you testDate will cause deprecation warning

Deprecation warning: value provided is not in a recognized RFC2822 or ISO format...

var testDate= "Fri Apr 12 2013 19:08:55 GMT-0500 (CDT)"

let s= moment(testDate).format('MM/DD/YYYY');

msg.innerText= s;
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

<div id="msg"></div>

to omit this warning you should provide parsing format

var testDate= "Fri Apr 12 2013 19:08:55 GMT-0500 (CDT)"

let s= moment(testDate, 'ddd MMM D YYYY HH:mm:ss ZZ').format('MM/DD/YYYY');

console.log(s);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

Upvotes: 7

Akalya
Akalya

Reputation: 906

Include moment.js and using the below code you can format your date

var formatDate= 1399919400000;

var responseDate = moment(formatDate).format('DD/MM/YYYY');

My output is "13/05/2014"

Upvotes: 64

Related Questions