Does not refresh Datepicker when using beforeShowDay

0

Good morning. I am using Jquery UI datepicker as follows:

$(document).ready(function(){
initComponent();
});

var j = 0;
function checkDate(date) {
    j++;
    if (j>5 && j<10)
    {
        return [true, 'event',''];
    }
    else if (j>20 && j<25)
    {
        return [true, 'event2',''];
    }
    else
    {
        return [true,''];
    }

     }

function initComponent(){
    $.datepicker.setDefaults($.datepicker.regional["es"]);
    $( "#datepicker" ).datepicker({
        firstDay: 1,
        inline: true,
        showOtherMonths: true,
        dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
        dateFormat: 'dd-mm-yyyy',
        beforeShowDay: checkDate
    });

}

This code shows me the datepicker calendar with different style the dates selected with the event and event2 styles. The problem is that, once the calendar is loaded, if I select any date, the style that had been modified with beforeShowDay is deleted, leaving the default style on all days of the month. I tried with refresh on onSelect but it did not work for me. Do you know if I'm missing something or what kind of mistake I'm making?

The body of the HTML is simply:

<div id="datepicker"></div>

Thank you.

    
asked by cmr 16.01.2017 в 12:28
source

1 answer

0

You are determining the style according to the variable j , which has nothing to do with the date.

As you initialize j to 0, the first time you select a date, j will be equal to 1 and your function returns that the datepicker should not have style. If you selected a date five times in a row, the event style would probably apply.

What your function has to do (from what I just looked for), is something similar to this:

function checkDate(date) {
    var dia = date.getDate();

    if (dia>5 && dia<10)
    {
        return [true, 'event',''];
    }
    else if (dia>20 && dia<25)
    {
        return [true, 'event2',''];
    }
    else
    {
        return [true,''];
    }
}

In this way, depending on the day of the selected date, you determine the style.

Source: Answer in Stack Overflow : JQuery DatePicker and beforeShowDay

    
answered by 16.01.2017 / 14:17
source