Flatpickr - Date changes automatically to american version instead of UK Format.

I am using flat pickr and the date that gets given to the input would be as such:

01/02/1991 (Day 1 / Month Feb / Year 1991.

However when I add the class flatpickr it converts the date to:


The american version of the date.

I thought that I could fix this easily by doing the below code:

init() {
    let flatPicker = document.querySelector('.flatpickr')

    if (flatPicker) {
        flatPickr.l10ns.default.weekdays.shorthand = ['S', 'M', 'T', 'W', 'T', 'F', 'S']

        new flatPickr(flatPicker,
                nextArrow: '<svg class="icon icon-arrow-right"><use xlink:href="/dist/assets/svg-definition/symbol-defs.svg#icon-arrow-right"></use></svg>',
                prevArrow: '<svg class="icon icon-arrow-left"><use xlink:href="/dist/assets/svg-definition/symbol-defs.svg#icon-arrow-left"></use></svg>',

                // Date format
                altInput: true,
                altFormat: 'd-m-Y',

                // Default Date
                dateFormat: 'd-m-Y'

The important bit I thought would be the dateFormat: 'd-m-Y'.

Can anyone else spot what I am doing wrong here?

Many thanks



You need a custom date parser. Because d.m.y is not standard date format. Before flatpickr() add this code below and it needs moment.js

Flatpickr.defaultConfig.parseDate = function(str) {
    return moment.utc(str, "DD.MM.YYYY").toDate();


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.