1. INCLUDE CSS AND JS FILES
<link rel="stylesheet" type="text/css" href="http://reaktor.github.com/jquery-continuous-calendar/build/jquery.continuousCalendar-latest.css" />
<!-- required JavaScript files -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<script type="text/javascript" src="http://reaktor.github.com/jquery-continuous-calendar/build/jquery.continuousCalendar-latest.js"></script>
2. HTML
<!-- range selection is attached to fields with class startDate and endDate -->
<div id="dateRange1">
<input type="hidden" class="startDate" name="range_start">
<input type="hidden" class="endDate" name="range_end">
</div>
3. JAVASCRIPT
$("#dateRange1").continuousCalendar();
4. OPTIONS
weeksBefore
Default: 26
Type: Number
Specifies amount of weeks displayed before selection. If no default selection then count from current day.
weeksAfter
Default: 26
Type: Number
Specifies amount of weeks displayed after selection. If no default selection then count from current day.
firstDate
Default: null
Type: String
Specifies exact date for calendar start. this is alternative for weeksBefore. Date is in current short date format, i.e. 12/31/2011 or 31.1.2011.
lastDate
Default: null
Type: String
Specifies exact date for calendar end. This is alternative for weeksAfter. Date is in current short date format, i.e. 12/31/2011 or 31.1.2011.
startField
Default: $('input.startDate', this)
Type: jQuery object
Specifies jquery element for start input field. This is used also for single date calendar
endField
Default: $('input.endDate', this)
Type: jQuery object
Specifies jquery element for end input field.
isPopup
Default: false
Type: Boolean
Specifies if calendar opens as popup or as inline version
selectToday
Default: false
Type: Boolean
True, of current date is to be chosen, even if input field is empty.
locale
Default: false
Type: Boolean
Specifies locale for rendering calendar and parsing input fields.
disableWeekends
Default: false
Type: Boolean
True if weekends are disabled.
disabledDates
Default: null
Type: String
Space separated list of disabled dates. Dates are presented in short date format of current locale.
minimumRange
Default: -1
Type: Number
Sets minimum range permitted in days. Shorter selections are expanded automatically.
selectWeek
Default: false
Type: Boolean
Set to true for automatically selecting full weeks.
fadeOutDuration
Default: 0
Type: Number
Duration for fade out. Value is passed for jQuery's .fadeOut function.
callback
Default: $.noop
Type: Function
Function called in init and after date selection. DateRange or Date is passed as argument and this points to calendar container.
theme
Default: ''
Type: String
Theme to be used. Currently available alternative themes are rounded and transparent. Don't forget to include the required css for the theme.
-
5. METHODS
-
.continuousCalendar(options)
-
Creates a continuous calendar. Start and end input's are created if they don't exist. When created manually, they must have classes startDate and endDate and they must be inside the container. Options are passed in object. See options below.
-
.calendarRange(), returns DateRange
-
Returns calendar range object for current selection
-
6. EVENTS
-
calendarChange :
-
Triggered in calendar init and calendar selections. Event object contains DateRange or Date for current selection
JS Tutorial
