esharp esharp - 3 months ago 16x
jQuery Question

jQuery datepicker onSelect calling .append() not working

I'm trying to append the selected day to the banner-section of a jQuery datepicker. However, when I have (something like) the following on the datepicker's onSelect I do not see any changes.


...however, when I just run this line in the console it works as I expect. Can someone help me understand why?


Well this could be a lot of work but it solves the issue.

Here is the fiddle:

I basically add a data attribute to the datepicker using

$("#datepicker").attr('data-date', (d.getDate() +1));

Then you would need to create 31 css codes as follows:

#datepicker[data-date="6"] .ui-datepicker-month:after { content: " 6," }

The fiddle provides 6,7 and 8 as a sample. Hope this helps and I also hope you find a simple solution.

Note: Personally when I need to use a component such as this with many custom features, I prefer making my own component from scratch. It is lesser work overall. I have made one like datapicker once... it wasn't that hard and provided tons of additional user friendly features.

here's a short ruby loop for generating css:

(1..31).each do |i|
    p "#datepicker[data-date='#{i}'] .ui-datepicker-month:after { content: ' #{i},' }"