Bootstrap datepicker error when using other language: Uncaught TypeError: Cannot read property 'length' of undefined

Question

I'm using the datepicker from Bootstrap (http://bootstrap-datepicker.readthedocs.org/en/latest/i18n.html). When using datepicker without the "language" property, it works, but when I try to specify a language ("sv"), it fails with the message (i.e when trying to select a date in the widget):

Uncaught TypeError: Cannot read property 'length' of undefined

These are the versions I'm using:

jQuery v1.8.3

jQuery UI 1.8.22

Boostrap 2.3.1

From looking at the debugger it seems that this is the code that crashes (Datetimepicker.prototype, the row with "p: "):

    formatDate:       function (date, format, language, type) {
        if (date == null) {
            return '';
        }
        var val;
        if (type == 'standard') {
            val = {
                // year
                yy:   date.getUTCFullYear().toString().substring(2),
                yyyy: date.getUTCFullYear(),
                // month
                m:    date.getUTCMonth() + 1,
                M:    dates[language].monthsShort[date.getUTCMonth()],
                MM:   dates[language].months[date.getUTCMonth()],
                // day
                d:    date.getUTCDate(),
                D:    dates[language].daysShort[date.getUTCDay()],
                DD:   dates[language].days[date.getUTCDay()],
                p:    (dates[language].meridiem.length == 2 ? dates[language].meridiem[date.getUTCHours() < 12 ? 0 : 1] : ''),
                // hour
                h:    date.getUTCHours(),
                // minute
                i:    date.getUTCMinutes(),
                // second
                s:    date.getUTCSeconds()
            };

This is the working code (a widget in english):

    var dates = $('#date-picker input[name=from_date], .facet-container input[name=to_date]').datetimepicker({
        format: 'yyyy-mm-dd',
        autoclose:'true',
        todayBtn:'true',
        pickerPosition:'bottom-left',
        minView:'month'
    }).on('changeDate', function(ev){

    });

This crashes:

 $.fn.datetimepicker.dates['sv'] = {
        days: ["Söndag", "Måndag", "Tisdag", "Onsdag", "Torsdag", "Fredag", "Lördag"],
        daysShort: ["Sön", "Mån", "Tis", "Ons", "Tor", "Fre", "Lör"],
        daysMin: ["Sö", "Må", "Ti", "On", "To", "Fr", "Lö"],
        months: ["Januari", "Februari", "Mars", "April", "Maj", "Juni", "Juli", "Augusti", "September", "Oktober", "November", "December"],
        monthsShort: ["Jan", "Feb", "Mar", "Apr", "Maj", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"],
        today: "Idag",
        clear: "Rensa"
    };

    var dates = $('#date-picker input[name=from_date], .facet-container input[name=to_date]').datetimepicker({
        format: 'yyyy-mm-dd',
        autoclose:'true',
        weekStart: 1,
        language:'sv',
        todayBtn:'true',
        pickerPosition:'bottom-left',
        minView:'month'
    }).on('changeDate', function(ev){
    });

What could be the problem??

Answer 1

This fixed it, i.e had to add a "meridiem" property:

      $.fn.datetimepicker.dates['sv'] = {
        days: ["Söndag", "Måndag", "Tisdag", "Onsdag", "Torsdag", "Fredag", "Lördag"],
        daysShort: ["Sön", "Mån", "Tis", "Ons", "Tor", "Fre", "Lör"],
        daysMin: ["Sö", "Må", "Ti", "On", "To", "Fr", "Lö"],
        months: ["Januari", "Februari", "Mars", "April", "Maj", "Juni", "Juli", "Augusti", "September", "Oktober", "November", "December"],
        monthsShort: ["Jan", "Feb", "Mar", "Apr", "Maj", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"],
        meridiem: '',
        today: "Idag",
        clear: "Rensa"
    };