Is there a way to paint the days of the jQuery Datepicker different colors ?
For example:
Where the blue color indicates the first session, green the second and red the third.
I have 3 sessions (3 intervals)
Is there a way to paint the days of the jQuery Datepicker different colors ?
For example:
Where the blue color indicates the first session, green the second and red the third.
I have 3 sessions (3 intervals)
You can use the beforeShowDay option . It is a function that, although not very intuitive, allows you to customize the day elements.
Let's say you want to mark the days "8"
The function you pass to
beforeShowDay
is called automatically for each day of the calendar page to be displayed. In the function you will receive an objectDate
with the corresponding day, with this you can decide if you are going to modify the element.Now what is not obvious is that you have to return an array with 3 values:
true/false
Finally, you always have to return at least
[true]
so that the rest of the days are eligible.As an additional detail
The style must be set to the child element
a
of our class, usingbackground
, withbackground-color
no result since the jQuery UI css writes it withbackground
and it is applied at the end, in addition to using¡important;
You can take the elements according to the quantities you need using the Slice method
The ui-state-default class is the one with the day element, and in the example the first 3 elements are taken.
It would be necessary to determine the logic to determine the periods based on your needs