how convert date format in javascript reactjs

Question

<b>Select Datetime</b><br/>
<DateTimeField onChange={this.clockevent} format={"x"}/>   

clockevent=(newDate)=>{
    var dateVal ="/Date("+newDate+")/";
    var date = new Date(parseFloat(dateVal.substr(6)));


    console.log(
    date.getFullYear() + " " +
    (date.getMonth() + 1) + "/" +
    date.getDate() + "  " +

    date.getHours() + ":" +
    date.getMinutes() + ":" +
    date.getSeconds() );
}

result :

2018/2/1 14:16:0

i want the result add day,month and ss ' format (DD MM ss) i want to this format =

2018/02/01 14:16:00

Does this answer your question? How do I format a date in JavaScript? — Liam
– Liam, Commented Jul 25, 2022 at 11:53

Rodius · Accepted Answer · 2018-02-05 11:41:18Z

23

I haven't found the way to format YYYY/MM/DD as you asked but I have the 2-digit format.

const today = Date.now();

console.log(new Intl.DateTimeFormat('en-US', {year: 'numeric', month: '2-digit',day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit'}).format(today));

answered Feb 5, 2018 at 11:41

Rodius

2,32117 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rodius Over a year ago

That's great! Glad I helped!

zeaolanos Over a year ago

but result , 01.02.2018 14:48:00 i try sequential : 20180201144800 like this, is it possible?

stldoug Over a year ago

Format YYYY/MM/DD :: new Intl.DateTimeFormat( 'fr-ca' ).format( new Date( ) ).replace(/-/g,'/');

siva surya · Accepted Answer · 2021-11-16 04:26:58Z

23

Use date-fns library

for "2018/02/01 14:16:00" this format use the following code

import { format } from 'date-fns';
console.log(format(new Date(), 'yyyy/MM/dd kk:mm:ss'))

with this you can customize your own format.

date-fns

For customizing date format use this

edited Nov 16, 2021 at 4:26

answered Aug 7, 2020 at 6:23

siva surya

7218 silver badges12 bronze badges

2 Comments

null Over a year ago

This is the simplest and shortest way

Johnathan Awma Over a year ago

It would be nice to add plugin link, so that viewer doesn't need to search for it.

fatihyildizhan · Accepted Answer · 2020-10-01 10:08:26Z

8

I found the easiest solution for the React.js developer.

In my schema(In the backend) date format was like this.

createdAt: {
       type: Date,
       default: Date.now()
}

It will give me output as 2019-04-30T08:59:00.000Z which is (YYYY-MM-DD'T'HH:MM:SS.SSSZ) format. To change the date format in Frontend you can easily solve the problem using

1. npm install dateformat
2. import dateFormat from 'dateformat';
3. dateFormat("2019-04-30T08:59:00.000Z", "mmmm dS, yyyy") to get April 30th, 2019
or dateFormat("2019-04-30T08:59:00.000Z", "dddd, mmmm dS, yyyy") to get Tuesday, April 30th, 2019.

edited Oct 1, 2020 at 10:08

fatihyildizhan

8,8207 gold badges68 silver badges92 bronze badges

answered May 15, 2019 at 11:52

surbhi241

811 silver badge2 bronze badges

2 Comments

Jonathan Burgos G. Over a year ago

you can add some link to see all the documentation and implementation. Thanks!

saravana kumar ramasamy Over a year ago

npmjs.com/package/dateformat

Musadul Islam · Accepted Answer · 2021-11-06 12:43:21Z

3

Just use moment and define the format as below

moment(yourDate).format("YYYY/MM/DD kk:mm:ss");

answered Nov 6, 2021 at 12:43

Musadul Islam

4084 silver badges11 bronze badges

1 Comment

KampretLauncher Over a year ago

Moment.js no longer maintained, please read their announcement here: momentjs.com/docs/#/-project-status

The pyramid · Accepted Answer · 2018-12-08 08:41:12Z

1

You can use dateformat lib (https://github.com/felixge/node-dateformat) , it has so many options that can help you , and it's easy to use , you can use it in front-end or back-end , it worked fine for me here an example :

dateFormat(expirationdate, "yyyy-mm-dd")

answered Dec 8, 2018 at 8:41

The pyramid

3231 gold badge6 silver badges18 bronze badges

Comments

zeaolanos · Accepted Answer · 2018-02-06 06:45:05Z

0

  i did.  
        var dateVal ="/Date("+newDate+")/";
        var date = new Date(parseFloat(dateVal.substr(6)));
        const YYYY = date.getFullYear();
        let DD = date.getMonth()+1;
        let MM = date.getDate();
        let HH = date.getHours() ;
        let mm = date.getMinutes()
        let ss = date.getSeconds();


        if(DD<10)
        {
            DD=`0${DD}`;
        }
        if(MM<10)
        {
            MM=`0${MM}`;
        }

        if(HH<10)
        {
            HH=`0${HH}`;
        }
        if(mm<10)
        {
            mm=`0${mm}`;
        }
        if(ss<10)
        {
            ss=`0${ss}`;
        }

        const ltime= (YYYY+DD+MM+HH+mm+ss);

answered Feb 6, 2018 at 6:45

zeaolanos

2211 gold badge2 silver badges10 bronze badges

Comments

Ankit Jindal · Accepted Answer · 2022-12-30 06:50:37Z

0

Moment JS provide control on each date string and you can easily convert into another format easily.

Install Moment Package:

npm install --save moment

Convert date format using moment:

import Moment from 'moment';
  
class App extends Component {
  constructor() {
  
    this.state = {
      dateDMY: Moment("1994-07-01").format('DD-MM-YYYY'),
      dateMDY: Moment("1994-07-01").format('MM-DD-YYYY'),
      dateYMD: Moment("01-07-1994").format('YYYY-MM-DD')
    }
  }
  
  render() {
    return (
      <div>
        <p> DMY Format: { this.state.dateDMY } </p>
        <p> MDY Format: { this.state.dateMDY } </p>
        <p> YMD Format: { this.state.dateYMD } </p>
      </div>
    );
  }
}
   
render(<App />, document.getElementById('root'));

Output:

DMY Format: 01-07-1994
MDY Format: 07-01-1994
YMD Format: 1994-01-07

answered Dec 30, 2022 at 6:50

Ankit Jindal

4,0863 gold badges32 silver badges41 bronze badges

2 Comments

khocef Over a year ago

momentjs is no longer maintained

Ankit Jindal Over a year ago

We can use npmjs.com/package/date-fns as an alternative to moment-js

sigma1510 · Accepted Answer · 2023-11-09 19:48:39Z

0

Since moment is no longer maintained, you can now use dayjs:

dayjs("2019-04-30T08:59:00.000Z").format("YYYY/MM/DD hh:mm:ss")

answered Nov 9, 2023 at 19:48

sigma1510

1,3111 gold badge13 silver badges33 bronze badges

Comments

Sudarshan Nagre · Accepted Answer · 2022-07-25 11:46:41Z

-1

I used below logic, It may help you.

{new Date(your date).toLocaleString("lookup")}

edited Jul 25, 2022 at 11:46

answered Jul 25, 2022 at 11:45

Sudarshan Nagre

573 bronze badges

Collectives™ on Stack Overflow

how convert date format in javascript reactjs

9 Answers 9

3 Comments

Use date-fns library

2 Comments

2 Comments

1 Comment

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

9 Answers 9

3 Comments

Use date-fns library

2 Comments

2 Comments

1 Comment

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related