Please can you help me to solve these below issues in jquery datepicker
I want to highlight the start date '09/01/2015' to end date '09/30/2015' without adding every single day, like:
eventDates[ new Date( '09/01/2015', 09/31/2015 )] = 'unavailable';
This is what my code looks like:
var eventDates = {};
eventDates[ new Date( '09/01/2015' )] = 'unavailable';
eventDates[ new Date( '09/02/2015' )] = 'unavailable';
eventDates[ new Date( '09/03/2015' )] = 'unavailable';
eventDates[ new Date( '09/04/2015' )] = 'unavailable';
eventDates[ new Date( '09/05/2015' )] = 'unavailable';
eventDates[ new Date( '09/06/2015' )] = 'unavailable';
eventDates[ new Date( '09/07/2015' )] = 'unavailable';
eventDates[ new Date( '09/08/2015' )] = 'unavailable';
eventDates[ new Date( '09/09/2015' )] = 'unavailable';
eventDates[ new Date( '09/10/2015' )] = 'unavailable';
eventDates[ new Date( '09/11/2015' )] = 'unavailable';
eventDates[ new Date( '09/12/2015' )] = 'unavailable';
eventDates[ new Date( '09/13/2015' )] = 'unavailable';
eventDates[ new Date( '09/14/2015' )] = 'unavailable';
eventDates[ new Date( '09/15/2015' )] = 'unavailable';
eventDates[ new Date( '09/16/2015' )] = 'unavailable';
eventDates[ new Date( '09/17/2015' )] = 'unavailable';
eventDates[ new Date( '09/18/2015' )] = 'unavailable';
eventDates[ new Date( '09/19/2015' )] = 'unavailable';
eventDates[ new Date( '09/20/2015' )] = 'unavailable';
eventDates[ new Date( '09/21/2015' )] = 'unavailable';
eventDates[ new Date( '09/22/2015' )] = 'unavailable';
eventDates[ new Date( '09/23/2015' )] = 'unavailable';
eventDates[ new Date( '09/24/2015' )] = 'unavailable';
eventDates[ new Date( '09/25/2015' )] = 'unavailable';
eventDates[ new Date( '09/26/2015' )] = 'unavailable';
eventDates[ new Date( '09/27/2015' )] = 'unavailable';
eventDates[ new Date( '09/28/2015' )] = 'unavailable';
eventDates[ new Date( '09/29/2015' )] = 'unavailable';
eventDates[ new Date( '09/30/2015' )] = 'unavailable';
$( ".section-booking .date-picker-inline1" ).datepicker({
beforeShowDay: function(date) {
var highlight = eventDates[date];
if (highlight) {
return [true, 'css-class-to-highlight ' + highlight, ''];
} else {
// default
return [true, '', ''];
}
}
Why not just create a highlight function like this:
function highlight(start, end){
var currentDay = start;
while(currentDay <= end){
eventDates[currentDay] 'unavailable';
currentDay.setDate(currentDay.getDate() + 1);
}
}
And then call the function with your dates that you want highlighted:
highlight(new Date('09/01/2015'), new Date('09/30/2015'));
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.