Description |
Example |
Default behaviour.
$('#date1').datetextentry(); |
|
Change field order and separator.
$('#date2').datetextentry({
field_order : 'YMD',
separator : '-'
}); |
|
Disable tooltips - leaving only field hints.
$('#date3').datetextentry({
show_tooltips : false,
show_hints : true
}); |
|
Disable field hints - leaving only tooltips.
$('#date4').datetextentry({
show_tooltips : true,
show_hints : false
}); |
|
Disable tooltips and re-position error box for messages below the
widget rather than to the right.
$('#date5').datetextentry({
show_tooltips : false,
errorbox_x : -135,
errorbox_y : 28
}); |
|
Specify allowable date range using maximum and minimum dates.
$('#date6').datetextentry({
min_date : '1970-01-01',
min_date_message : 'Please select a date in the 1970s',
max_date : '1979-31-12',
max_date_message : 'Please select a date in the 1970s',
}); |
|
Specify allowable date range using a minimum year - with
the default message; and using a function to calculate the maximum
date.
$('#date7').datetextentry({
min_year : '2000',
max_date : function() { return this.get_today(); },
max_date_message : 'Date must not be in the future'
});
Note: Your function should return an object like:
{ day: '02', month: '06', year: '2012' }
When the function is called, this will point to the datetextwidget object, which provides a get_today() method returning the current date in the
required format. |
|
Use a custom validation function to apply arbitrary rules.
$('#date8').datetextentry({
custom_validation : function(valid) {
if(valid.year === '1983' && valid.date.getDay() === 2) {
return;
}
throw "Please select a Tuesday in 1983";
}
}); |
|
Your code can interact with the datetextentry widget
after it has been initialised. You can set and clear the date value
as well as moving focus to the widget's first field:
$('#date9').datetextentry();
$('#launch-dates li').click(function() {
$('#date9').datetextentry('set_date', $(this).data('date'));
});
$('#btn-clear').click(function() {
$('#date9').datetextentry('clear');
});
$('#btn-focus').click(function() {
$('#date9').datetextentry('focus');
}); |
|
Supply a callback function to be run when a valid date is entered.
$('#date10').datetextentry({
on_change : function(date_str) {
$('#valid-date10').text(date_str);
}
}); |
Validated date: |
Supply a callback function to be run when the error status changes -
in this case used to put the field label in 'error' mode.
$('#date11').datetextentry({
on_error : function(msg) {
$('label[for=date11]').toggleClass('error', msg !== '');
}
}); |
|