bootstrap-datepicker + requirejs + localizations

[massimo malvestio]

Hello everybody, i think I have an issue about localizations and require js.

Conditions

1) I use require js to load libraries

2) I use bootstrap3 version of datepicker, and it works great

3) I'd like to manage localizations, i.e. italian and french

This is a portion of my requirejs config

require.config({

    paths: {

        ...

        "angular": "libs/angular",

        "jquery": "libs/jquery",

       ...

        "editable": "libs/bootstrap-editable",

        "datepicker": "libs/bootstrap-datepicker",

        "datepickerIt": "locales/bootstrap-datepicker.it.min"

    },

    shim: {

        "angular": {

            exports: "angular"

        },

        "bootstrap": {

            "deps": ["jquery"]

        },

        "datepicker": {

            deps: ["bootstrap", "jquery"],

            exports: "$.fn.datetimepicker"

        },

        "editable": {

            deps: ["jquery", "datepicker"],

            exports: "$.fn.editable"

        },

        "datepickerIt": {

            deps: ["jquery", "datepicker"],

            exports: "$.fn.datepicker.dates.it"

        }

    },

    deps: [

        "./starter"

    ]

});

Observed behaviour

When datepicker is executed, I notice an error in the developer console, claiming that "Cannot read property 'daysShort' of undefined", because no italian localization is loaded, only default en, according to what I see using the debugger.
It looks like that I should make datepicker dependent on datepickerIt in the requirejs config file, but if i try an exception is thrown, because localization needs datepicker function.

So, how could I solve it?

In my controller I tried to force initializaton of locale invoking $.fn.datepicker.dates['it'] = {...}, passing desired data, but without any success (obviously before datepicker initializes the specific field).

Thanks in advance, hoping I did not write too many technical and syntaxial errors =^.^=

[Artur Mamedov]

Are you find some way for do this? I'm getting crazy for make it work :D

[Artur Mamedov]

At the end i only add the used locales by my app before call datepicker:

```

// # locales
switch (bsdp_lang_code) {
    case'it':
        $.fn.datepicker.dates['it'] = {
            days: ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato"],
            daysShort: ["Dom", "Lun", "Mar", "Mer", "Gio", "Ven", "Sab"],
            daysMin: ["Do", "Lu", "Ma", "Me", "Gi", "Ve", "Sa"],
            months: ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"],
            monthsShort: ["Gen", "Feb", "Mar", "Apr", "Mag", "Giu", "Lug", "Ago", "Set", "Ott", "Nov", "Dic"],
            today: "Oggi",
            monthsTitle: "Mesi",
            clear: "Cancella",
            weekStart: 1,
            format: "dd/mm/yyyy"
        };
        break;
    case'fr':
        $.fn.datepicker.dates['fr'] = {
            days: ["dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi"],
            daysShort: ["dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam."],
            daysMin: ["d", "l", "ma", "me", "j", "v", "s"],
            months: ["janvier", "février", "mars", "avril", "mai", "juin", "juillet", "août", "septembre", "octobre", "novembre", "décembre"],
            monthsShort: ["janv.", "févr.", "mars", "avril", "mai", "juin", "juil.", "août", "sept.", "oct.", "nov.", "déc."],
            today: "Aujourd'hui",
            monthsTitle: "Mois",
            clear: "Effacer",
            weekStart: 1,
            format: "dd/mm/yyyy"
        };
        break;
    case'de':
        $.fn.datepicker.dates['de'] = {
            days: ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
            daysShort: ["Son", "Mon", "Die", "Mit", "Don", "Fre", "Sam"],
            daysMin: ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"],
            months: ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"],
            monthsShort: ["Jan", "Feb", "Mär", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez"],
            today: "Heute",
            monthsTitle: "Monate",
            clear: "Löschen",
            weekStart: 1,
            format: "dd.mm.yyyy"
        };
        break;
    case'pl':
        $.fn.datepicker.dates['pl'] = {
            days: ["niedziela", "poniedziałek", "wtorek", "środa", "czwartek", "piątek", "sobota"],
            daysShort: ["niedz.", "pon.", "wt.", "śr.", "czw.", "piąt.", "sob."],
            daysMin: ["ndz.", "pn.", "wt.", "śr.", "czw.", "pt.", "sob."],
            months: ["styczeń", "luty", "marzec", "kwiecień", "maj", "czerwiec", "lipiec", "sierpień", "wrzesień", "październik", "listopad", "grudzień"],
            monthsShort: ["sty.", "lut.", "mar.", "kwi.", "maj", "cze.", "lip.", "sie.", "wrz.", "paź.", "lis.", "gru."],
            today: "dzisiaj",
            weekStart: 1,
            clear: "wyczyść",
            format: "dd.mm.yyyy"
        };
        break;
    case'nl':
        $.fn.datepicker.dates['nl'] = {
            days: ["zondag", "maandag", "dinsdag", "woensdag", "donderdag", "vrijdag", "zaterdag"],
            daysShort: ["zo", "ma", "di", "wo", "do", "vr", "za"],
            daysMin: ["zo", "ma", "di", "wo", "do", "vr", "za"],
            months: ["januari", "februari", "maart", "april", "mei", "juni", "juli", "augustus", "september", "oktober", "november", "december"],
            monthsShort: ["jan", "feb", "mrt", "apr", "mei", "jun", "jul", "aug", "sep", "okt", "nov", "dec"],
            today: "Vandaag",
            monthsTitle: "Maanden",
            clear: "Wissen",
            weekStart: 1,
            format: "dd-mm-yyyy"
        };
        break;
}

// date picker
bs_datepicker.datepicker({
    startDate: start_date.getDate() + '/' + (start_date.getMonth() + 1) + '/' + start_date.getFullYear(),
    endDate: end_date.getDate() + '/' + (end_date.getMonth() + 1) + '/' + end_date.getFullYear(),
    format: 'dd/mm/yyyy',
    inputs: $('.range', bs_datepicker),
    todayHighlight: true,
    todayBtn: 'linked',
    daysOfWeekHighlighted: "0",
    zIndexOffset: 9999,
    orientation: 'bottom',
    autoclose: true,
    language: bsdp_lang_code
});

```