Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

FullCalendar date format

Want to find the way to change the default date format in FullCalendar.

Actually, it is:
Tue Aug 13 2013 18:00:00 GMT-0400 (EDT)

I want:
2013-08-13

Thanks.

like image 752
Francois Avatar asked Aug 31 '13 18:08

Francois


People also ask

How do I change the date on Fullcalendar?

The calendar's dates can change any time the user does the following: click the prev/next buttons, change the view, click a navlink. The dates can also change when the current-date is manipulated via the API, such as when gotoDate is called. datesSet is called after the new date range has been rendered.

How do I get the current date in Fullcalendar?

Calendar::getDate Returns a Date for the current date of the calendar. For month view, it will always be some time between the first and last day of the month. For week views, it will always be sometime between the first and last day of the week.

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').

How do I turn off full date in Fullcalendar?

You can try the following thread's solution(dayClick or select function to disable the dayclick for the past dates in fullcalendar). You can visit the fullcalendar support center and post your fullcalendar question on the StackOverflow fullcalendar tag.


1 Answers

For information specific to the FullCalendar, you probably need to see this, which gives you some formating rules. There's some more information here that might be useful.


Yet, you can do so with JavaScript directly if you need this date format in an interface between the FullCalendar and other package or your own code:

If you want "today", you can (be careful since that'll be client-side):

> (new Date()).toISOString().slice(0, 10)
'2013-08-31'

And from the string you said, you can:

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

Both would give you the ISO date in UTC. For locale date, you should "move" your time object to UTC before using .toISOString. Let:

> dateStr = "Mon Aug 12 2013 22:00:00 GMT-0400 (EDT)"
> dateObj = new Date(dateStr) /* Or empty, for today */
> dateIntNTZ = dateObj.getTime() - dateObj.getTimezoneOffset() * 60 * 1000
> dateObjNTZ = new Date(dateIntNTZ)
> dateObjNTZ.toISOString().slice(0, 10)
'2013-08-12'

Locale can still be different from GMT-0400 given in your example (here it's GMT-0300, at the end it gives me 1 hour after the one in this example).


I'll replicate here the information from the first FullCalendar link I said:

formatDate

Formats a Date object into a string.

$.fullCalendar.formatDate( date, formatString [, options ] ) -> String

Prior to version 1.3, formatDate accepted a very different format. See here.

formatString is a combination of any of the following commands:

  • s - seconds
  • ss - seconds, 2 digits
  • m - minutes
  • mm - minutes, 2 digits
  • h - hours, 12-hour format
  • hh - hours, 12-hour format, 2 digits
  • H - hours, 24-hour format
  • HH - hours, 24-hour format, 2 digits
  • d - date number
  • dd - date number, 2 digits
  • ddd - date name, short
  • dddd - date name, full
  • M - month number
  • MM - month number, 2 digits
  • MMM - month name, short
  • MMMM - month name, full
  • yy - year, 2 digits
  • yyyy - year, 4 digits
  • t - 'a' or 'p'
  • tt - 'am' or 'pm'
  • T - 'A' or 'P'
  • TT - 'AM' or 'PM'
  • u - ISO8601 format
  • S - 'st', 'nd', 'rd', 'th' for the date
  • W - the ISO8601 week number

Special Characters:

'...' literal text

'' single quote (represented by two single quotes)

(...) only displays format if one of the enclosed variables is non-zero

The options parameter can be used to override default locale options, such as monthNames, monthNamesShort, dayNames, and dayNamesShort.

like image 186
H.D. Avatar answered Sep 19 '22 12:09

H.D.