jquery UI datepicker- multiple selection functionality - jquery-ui

Question

I have a datepicker. When I select a date, automatically next two days should also get selected. In total, 3 business days should get selected.
I have tried below code but it's not working.
$('.date-pick').datePicker({
createButton:false,
displayClose:true,
closeOnSelect:false,
selectMultiple:true,
numSelectable:3
});

Answer 1

Your post did not include a details about the output or selection process. Here is an example for your review:
$(function() {
function dayNumOfWeek(d) {
var week = {
"Sun": 0,
"Mon": 1,
"Tue": 2,
"Wed": 3,
"Thu": 4,
"Fri": 5,
"Sat": 6,
}
return week[d];
}
$(".date-pick").datepicker({
showButtonPanel: true,
closeText: "Close",
beforeShowDay: $.datepicker.noWeekends,
onSelect: function(dt) {
var myDays = [
new Date(dt),
new Date(dt),
new Date(dt)
];
var dow = myDays[0].getDay();
var dp = $(".date-pick");
console.log("Selected: " + dow + "/7, " + dt, myDays);
switch (dow) {
case 1:
case 2:
case 3:
console.log("mtw");
myDays[1].setDate(myDays[1].getDate() + 1);
myDays[2].setDate(myDays[2].getDate() + 2);
break;
case 4:
console.log("rfm");
myDays[1].setDate(myDays[1].getDate() + 1);
myDays[2].setDate(myDays[2].getDate() + 4);
break;
case 5:
console.log("fmt");
myDays[1].setDate(myDays[1].getDate() + 3);
myDays[2].setDate(myDays[2].getDate() + 4);
break;
};
var fDT = [];
console.log("Format Dates");
var mm, dd, yy;
for (var i = 0; i < 3; i++) {
console.log(i, myDays[i]);
mm = myDays[i].getMonth() + 1;
dd = myDays[i].getDate();
yy = myDays[i].getFullYear();
mm = (mm < 10 ? "0" + mm : mm);
dd = (dd < 10 ? "0" + dd : dd);
fDT[i] = mm + "/" + dd + "/" + yy;
};
console.log("Formatted:", fDT);
dp.val(fDT.join(", "));
return false;
}
});
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
Select Date: <input type="text" class="date-pick" />
When you make a selection, you can manage what is done via onSelect that receives the date in text. Since you are working with business days of the week, mon to fri, and months, you want to make sure that selecting a date near the end of the week and end of the month calculates the next few days properly.
Converting to JavaScript Date type, you can leverage a lot of the tools to calculate the next few days without issues. You have 3 scenarios: Mon, Tues, Wed. as 1, Thur, Fri, Mon as 2, and Fri, Mon, Tue as 3.
When you make a selection, it picks the next 2 days from the business week.