Set several initial dates in inline datetimepicker tempusdominus

user_2160127 0
Viewed 1490

I'm trying to set up the datetimepicker on https://tempusdominus.github.io/bootstrap-3/ and configure it to be used inline. It is initialized with:

$('#datetimepicker5').datetimepicker({
    inline: true,
    allowMultidate: true,
    multidateSeparator: ';',
    locale: 'nb',
    format: 'L',
    useCurrent: false,
});

It works, but I cannot find out how to initialize several dates. As you can see I use it with allowMultidate.

So, how can I initialize the datetimepicker with several dates pre-set?

tempus-dominus-datetimepicker bootstrap-datetimepicker datetimepicker
3 Answers

I met the same problem and I can't find any answers here. So I tried to resolve it with a little revise to "tempusdominus-bootstrap-4.js". I hope this will help you and make some reference for anyone who met the same problem.

At first adding a method multiDate for Object DateTimePicker.

var DateTimePicker = function () {
    …
    DateTimePicker.prototype.multiDate = function multiDate(params) {
        var date = params[0];
        var index = params[1];
        this.date(date, index);
    };
    …
}

The next, invoke your method at your page.
Suppose your initial data is like this:

var values = ['2019-02-06','2019-03-06','2019-05-08','2019-07-02'];

So you can initialize these in your multidatepicker.

var initializeMultidate = function(){
    for(var i=0; i<values.length; i++){
        var date = moment(values[i], 'YYYY-MM-DD');
        $("#datetimepicker1").datetimepicker("multiDate", [date, i]);
    }
};

=================================================

That's all.

user_120186220

The only solution I found was to do a search for the dates and using JQuery to click them, it is not elegant but it worked for me.

var fechas = ['01/10/2020', '02/10/2020', '03/10/2020'];
for (let index = 0; index < fechas.length; index++) {
    $("[data-day='"+fechas[index]+"']").click();
}
user_53598050
user_136204830
Related