Search code examples
javascriptdate-formatflatpickr

How to display ordinal number for date in javascript

I am currently implementing flatpickr for my pop-up calendars on my site, and my client has requested to show a specific format for their own use which includes the day of the week, and date with ordinal suffix. As I understand it, I can use a config setting called altInput to acheive this, and use altFormat to specify exactly how to display it.

Based on this, here is my config and instantiation:

var config = {
    enableTime : false,
    dateFormat: 'Y-m-d',
    altInput: true,
    altFormat: 'l, jS F Y'
};

$(".pickr").flatpickr(config);

As far as I am concerned, the displayed date should be as follows (using today as the picked date):

Tuesday, 10th October 2017

However, I actually get:

Tueaday 1000 October 2017

So it seems the ordinal suffix option (which according to PHP.net is an uppercase S) just displays two zeros. It's almost as if it's treating the uppercase S as a lowercase s, which is for seconds.

Am I missing something here? Is there another way to display the ordinal suffix in javascript?

Solution

  • That S stands for "Seconds, 2 digits"

    Instead of jS, you want J:

    "Day of the month without leading zeros and ordinal suffix"

    Take a look at flatpickr's formatting documentation.