Question

I need to apply a custom style to my datepicker but can’t work out how to add a custom class to the datepicker. I am defining my date picker as follows:

            $("#From").datepicker({
                showOn: 'button',
                buttonImage: '/Content/images/icon-calendar.gif',
                buttonImageOnly: true
            }, $.datepicker.regional['en-GB']);

How do I add a custom class to the datepicker div?

<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible MY_CLASS_GOES_HERE" id="ui-datepicker-div" style="position: absolute; top: 154px; left: 499px; z-index: 1; display: none;">

I know I can write:

$("#ui-datepicker-div).addClass("MY_CLASS_GOES_HERE")

..but can I rely on the datepicker always having an ID of “ui-datepicker-div”?? Is their a more elegant way of doing this?

Thanks in advance.

Answer 1

Yes you can rely on the ID being always the same, the same date picker is shared for multiple instances, so this does work reliably:

$("#ui-datepicker-div").addClass("MY_CLASS_GOES_HERE");