jQuery & jQueryUI Base

by andrewwhitaker

HTML

<link rel="stylesheet" href="http://ajax.microsoft.com/ajax/jquery.ui/1.8.7/themes/black-tie/jquery-ui.css">
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js"></script>
<div id="dates"></div>

CSS

.pink > a { 
    background-color: pink !important;
    background-image:none !important;
}

.green > a { 
    background-color: green !important;
    background-image: none !important;
}

JavaScript

var Event = function(text, className) {
    this.text = text;
    this.className = className;
};

var events = {};
events[new Date("02/14/2011")] = new Event("Valentines Day", "pink");
events[new Date("02/18/2011")] = new Event("Payday", "green");

console.dir(events);

$("#dates").datepicker({
    beforeShowDay: function(date) {
        var event = events[date];
        if (event) {
            return [true, event.className, event.text];
        }
        else {
            return [true, '', ''];
        }
    }
});