CODEWITHSUNDEEP
jqueryjquery-ui-datepicker
Sunil Kumar
Sunil Kumar

Reputation: 69

jQuery Datepicker Highlight my given date & remove current date highlighted

I tried setDate function, it added ui-state-active for date mentioned which is fine.

I have written class for ui-state-active make that hightlight display.

But the current date is also showing as highlighted with ui-state-hightlight. I want to remove this class adding for current date.

I am guessing this highlighting is happening through default attribute of date picker function.

But it is not having, written like this:

$(".datepickerfuture").datepicker({
    changeMonth: true,
    changeYear: true,
    showOn: "both",
    buttonImage: "../images/blank.gif",
    buttonImageOnly: true,
    minDate: new Date(),
});

Upvotes: 0

Views: 3761

Answers (2)

Sergey
Sergey

Reputation: 21

I solved this issue by very simple way: I've just removed all css rules of ui-state-highlight class from jquery.ui.css. Current date are higlighting with black border (similar as date picking in Windows 7) by adding only one css rule to ui-state-highlight class:

.ui-state-highlight {
    border-color: black !important;
}

But I used only one date picker ui widget in my project.

Upvotes: 0

Praveen
Praveen

Reputation: 56509

By overriding the default css .ui-datepicker-today and a.ui-state-highlight of with the below one.

.ui-datepicker-today a.ui-state-highlight {
    border-color: #d3d3d3;
    background: #e6e6e6 url(/themeroller/images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
    color: #555555;    
}

Check out this JSFiddle

Upvotes: 3

Related Questions