Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

FullCalendar date & time handling

I am using the FullCalendar script and am having trouble formatting the date/time of EVENTS on the calendar.

I need all the events date/time data to look like:

2011-09-28 08:15:00

All the dates are like this in my JSON source, which display on the calendar correctly. However, if the event is moved or a new event is added (dropped by eternal dragging), the time format looks like:

Fri Sep 30 2011 14:30:00 GMT-0400 (EDT)

It doesn't DISPLAY in that format, but it appears this way when I try to insert the event.start or event.end into my database, or when I do this:

eventClick: function(event) {

alert("Event ID: " + event.id + " Start Date: " + event.start + " End Date: " + event.end);
}

I am using this only to see how the date & time are saved within the calendar. I need to update my database with new events, but in the format first shown above, but I am having trouble doing this.

How do I use the formatDate function? I see it listed, and the reason I'm asking is because I don't know what to do with it.

I did:

$.fullCalendar.formatDate(event.start, 'MM-dd-yyyy');

but that doesn't do anything...

like image 837
Oseer Avatar asked Sep 29 '11 13:09

Oseer


People also ask

How do I set the date on Fullcalendar?

You should use the options 'year', 'month', and 'date' when initializing to specify the initial date value used by fullcalendar: $('#calendar'). fullCalendar({ year: 2012, month: 4, date: 25 }); // This will initialize for May 25th, 2012. See the function setYMD(date,y,m,d) in the fullcalendar.

How do I start and end date in Fullcalendar?

We can get start date by getView event with intervalStart. We can get end date by getView event with intervalEnd. var month = $('#calendar'). fullCalendar('getView').

What is Fullcalendar?

What is Fullcalendar? FullCalendar is a JavaScript library that seamlessly integrates with such popular JavaScript frameworks as Vue, React, Angular.

What is the use of Fullcalendar?

FullCalendar generates real React virtual DOM nodes so you can leverage Fiber, React's highly optimized rendering engine.


1 Answers

I have found your answer in a similar question, in here

Answered by H.D:

dateStr = "Tue Aug 13 2013 18:00:00 GMT-0400 (EDT)"
(new Date(dateStr)).toISOString().slice(0, 10)

It will display: '2013-08-13'

(new Date(dateStr)).toISOString()

It will display: '2013-08-13T18:00:00.000Z'

like image 115
Manza Avatar answered Oct 04 '22 17:10

Manza