set multiple dates on jquery datepicker programmatically

Question

I want to set multiple dates programmatically on an inline jQuery datepicker. I have an array of dates and I want to loop through them and on each iteration, a date should be selected in datepicker.

The result should be multiple dates selected on the inline jQuery datepicker.

This is what I'm trying, but I haven't had much success with it.

for(var j=0; j<dateArr.length; j++){
    $("#inlineDp").datepicker.('setDate',dateArr.pop());
}

Answer 1

That second part isn't a method: it's part of the datepicker constructor.

What you need to do is loop through your array and use that constructor each time (but initialize the datepicker before the loop).

As for selecting multiple dates, you can't do that by default (only one date can be selected at one time), so you'd have to use a third party plugin.

$("#inlineDp").datepicker();

for (var j = 0; j < dateArr.length; j++) {
    window.setTimeout(function(){
       $("#inlineDp").datepicker("setDate", dateArr[j]);
    }, 500);
}

(Note that for simplicity, this code does not take into account the problem with timeouts in loops (namely, that they don't work). However, the code in the demo below does (so you should use the code there instead of that from explanatory example above).)

Demo