0

How do I highlight or change the style of a date that has an event?

3 Answers 3

2

I tried this a while ago and found that it was easier to use a different datepicker and style it to act/look like jquery ui datepicker than make the datepicker take in data.

Sign up to request clarification or add additional context in comments.

Comments

1

If you look at the "Theming" tab in http://jqueryui.com/demos/datepicker/, it'll show you all the classes that you can style in CSS to get whatcha want :-) but i think its ui-state-highlight class

Comments

0

If you are asking for code to add event and change theme, I hope this helps you:

$("div").datepicker({
    beforeShowDay: function(date) {
        var result = [true, '', null];
        var matching = $.grep(events, function(event) {
            return event.Date.valueOf() === date.valueOf();
        });

        if (matching.length) {
            result = [true, 'highlight', null];
        }
        return result;
    },
    onSelect: function(dateText) {
        var date,
            selectedDate = new Date(dateText),
            i = 0,
            event = null;

        while (i < events.length && !event) {
            date = events[i].Date;

            if (selectedDate.valueOf() === date.valueOf()) {
                event = events[i];
            }
            i++;
        }
        if (event) {
            alert(event.Title);
        }
    }
});​

Calendar JSFiddle (retrieved from jQuery UI Datepicker : how to add clickable events on particular dates?)

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.