简体   繁体   中英

Highlight multiple dates on jquery datepicker

If I try to highlight dates on jquery datepicker by providing it a static array. It works absolutely fine. If I generate the array inside a loop and then provide it. There is no way that I found to get the dates highlighted. Code is below.

  // var tempDates=["2015/01/07","2015/01/14","2015/01/21"];
                var tempDates = []; tempDates=datesToHighlight;


                line.datepicker({disabled:false, defaultDate: dateObj, dateFormat: 'yy/mm/dd',
                    beforeShowDay: function (highlightMe) {
                        var dateString = jQuery.datepicker.formatDate('yy/mm/dd', highlightMe);
                        var highlightIndex = $.inArray(dateString.toString(), tempDates);
                        if(highlightIndex>-1) {
                            return [true, 'highlight', tips[highlightIndex]];
                        }
                        var aIndex = $.inArray(dateString, selected);
                        return [aIndex == -1]
                    }
                });

This is the format in which dates are generated by the loop.

 2015/01/07
 2015/01/14
 2015/01/21
 2015/01/28
 2015/02/04
 2015/02/11
 2015/02/18

Loop that I used to generate the array.

for (var k = 0; k < selectedArrayLength; k++) {
                    if (new Date(selected[k]).getMonth() == monthIndex[ind%12]) {

                        var dateFormat = new Date(selected.splice(k, 1));
                        var curr_date = addZ(dateFormat.getDate());
                        var curr_month = dateFormat.getMonth();
                        curr_month++;
                        var curr_year = dateFormat.getFullYear();
                        var newFormat = (curr_year + "/" + addZ(curr_month) + "/" + curr_date);
                        thisMonthDates.push(newFormat);
                        //thisMonthDates.push(selected.splice(k, 1));
                        k--; // since we removed an element we need to decrement k
                    }
                }


  for(var eachDt=0; eachDt<thisMonthDates.length; eachDt++) {
                    console.log(thisMonthDates[eachDt]);
                    var datesToHighlight = new Array();
                    datesToHighlight.push(new Date(thisMonthDates[eachDt]));

                }

Log of the code.

Year Difference: 2 end year: 2015 start year: 2015
78 Difference of days.
 12 : Selected Array Length 
 calendar0
 4
 2015/01/07
 2015/01/14
 2015/01/21
 2015/01/28
 4
 ["2015/01/07", "2015/01/14", "2015/01/21", "2015/01/28"]
 calendar1
 4
 2015/02/04
 2015/02/11
 2015/02/18
 2015/02/25
 4
 ["2015/02/04", "2015/02/11", "2015/02/18", "2015/02/25"]
 calendar2
 4
 2015/03/04
 2015/03/11
 2015/03/18
 2015/03/25
 4
 ["2015/03/04", "2015/03/11", "2015/03/18", "2015/03/25"]
 SELECTED ARRAY IS EMPTY.
 0,1,2 - 2015,2015,2015

Try updating your for loop for creating datesToHighlight . You don't need to create a date object for each thisMonthDates item and you were recreating a new array for each day so I moved your datesToHighlight initialization outside the loop.

var datesToHighlight = [];
for(var eachDt=0; eachDt<thisMonthDates.length; eachDt++) {
    console.log(thisMonthDates[eachDt]);
    datesToHighlight.push(thisMonthDates[eachDt]);
}

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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM