Calendrical

Date and Time

<input id="date" type="text" />
<input id="time" type="text" />

$('#date').calendricalDate(); 
$('#time').calendricalTime();

Date Range

<input id="date_start" type="text" />
<input id="date_end"   type="text" />

$('#date_start, #date_end')
    .calendricalDateRange();

Time Range

<input id="time_start" type="text" />
<input id="time_end"   type="text" />

$('#time_start, #time_end')
    .calendricalTimeRange();

DateTime Range

From:

To:

<p>
    <strong>From:</strong>
    <input id="dt_date_start" type="text" />
    <input id="dt_time_start" type="text" />
</p>
<p>
    <strong>To:</strong>
    <input id="dt_date_end"   type="text" />
    <input id="dt_time_end"   type="text" />
</p>

$('#dt_date_start, #dt_time_start,' +
  '#dt_date_end,   #dt_time_end')
    .calendricalDateTimeRange();