2

Unfortunately the Flowbite Datepicker Documentation has no instruction on how to use another locale, but the support is there.

This is how I implemented the datepicker (working):

import Datepicker from "flowbite-datepicker/Datepicker";

document.addEventListener("DOMContentLoaded", function () {
  document.querySelectorAll("[datepicker]").forEach(function (datepickerEl) {
    new Datepicker(datepickerEl);
  });
});

and this is how I try to get the locale to work:

import Datepicker from "flowbite-datepicker/Datepicker";
import { locales } from "../../node_modules/flowbite-datepicker/js/i18n/base-locales.js";
import de from "../../node_modules/flowbite-datepicker/js/i18n/locales/de.js";

locales.de = de;

const datepickerOptions = {
  language: "de",
  weekStart: 1,
};

document.addEventListener("DOMContentLoaded", function () {
  document.querySelectorAll("[datepicker]").forEach(function (datepickerEl) {
    const d = new Datepicker(datepickerEl);
    d.setOptions(datepickerOptions);
  });
});

But my modular Javascript understanding is too poor to get this right. This is the file to reference the original code. Should be straight forward for someone with more experience.

JanBoehmer
  • 395
  • 3
  • 14
  • Have you tried passing in `locale` in `datepickerOptions`? const datepickerOptions = { language: "de", weekStart: 1, locale:de }; You can do something like new Datepicker(datepickerEl, datepickerOptions) – mojorisinify Sep 10 '22 at 23:49
  • Can you also provide the code of the HTML parts? – Mario Ariyanto Sep 12 '22 at 01:42

2 Answers2

1

Instead of locales.de = de, try Datepicker.locales.de = de.

Check out this reference from the source repository.

mojorisinify
  • 377
  • 5
  • 22
0

I found out that flowbite-datepicker is forked from vanillajs-datepicker, and after checking their docs I got the following code to work:

import Datepicker from "flowbite-datepicker/Datepicker";
import ja from "flowbite-datepicker/locales/ja";

const datepickerEl = document.getElementById("datepickerId");
Object.assign(Datepicker.locales, ja);
const datePicker = new Datepicker(datepickerEl, {
  language: 'ja',
});
son_tran
  • 1
  • 1