jQuery DatePicker Not Highlighting in Custom Style Sheet

Question

I am using the jQuery DatePicker and i've got the following code which is supposed to change the default date to the one I have specified, in this example it is supposed to default and highlight 18th August 2017.

<script type="text/javascript">

jQuery(document).ready(function(){

    jQuery("#date").datepicker({dateFormat: 'yy-mm-dd'});

    jQuery("#date").datepicker('setDate', new Date('2017-08-18')); 

});

</script>

However, although it does actually default to date, if I use my default stylesheet provided in my theme template then it does't actually highlight the date and remove the old default highlighted day.

If I use the jQuery example stylesheet below, then it seems to work:

http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css

But if I use the stylesheet below provided in my theme, then it doesnt work:

http://themetrace.com/demo/shamcey/css/style.default.css

Any ideas how I can fix this?

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

I think that will work perfectly . I just tried that in shamcey demo page in the console . It worked perfectly

this is after i executed the code

Add this style in your style sheet

<style>
    .ui-state-active{
     background:#a5d2ff
    }
</style>

"#a5d2ff" is the color . You can replace with what ever color you want. This is the screen shot after i added that style

jQuery DatePicker Not Highlighting in Custom Style Sheet

Sign up