datetimepicker/index.html
Valeriy 5e02ecd865 Bug fixed
Padding button  fixed
2013-11-26 15:58:34 +06:00

65 lines
2.0 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/>
</head>
<body>
<h3>DateTimePicker</h3>
<input type="text" value="2014/03/15 05:06" id="datetimepicker"/><br><br>
<h3>TimePicker</h3>
<input type="text" id="datetimepicker1"/><br><br>
<h3>DatePicker</h3>
<input type="text" id="datetimepicker2"/><br><br>
<h3>Inline DateTimePicker</h3>
<input type="text" id="datetimepicker3"/><br><br>
<h3>Button Trigger</h3>
<input type="text" id="datetimepicker4"/><input id="open" type="button" value="open"/><input id="close" type="button" value="close"/>
<h3>TimePicker allows time</h3>
<input type="text" id="datetimepicker5"/><br><br>
<h3>Destroy DateTimePicker</h3>
<input type="text" id="datetimepicker6"/><input id="destroy" type="button" value="destroy"/>
</body>
<script src="jquery.js"></script>
<script src="jquery.datetimepicker.js"></script>
<script>
$('#datetimepicker').datetimepicker();
$('#datetimepicker').datetimepicker({value:'2015/04/15 05:06'});
$('#datetimepicker1').datetimepicker({
datepicker:false,
format:'H:i',
step:5,
});
$('#datetimepicker2').datetimepicker({
timepicker:false,
format:'d/m/Y',
formatDate:'Y/m/d',
minDate:'-1970/01/02', // yesterday is minimum date
maxDate:'+1970/01/02', // and tommorow is maximum date calendar
});
$('#datetimepicker3').datetimepicker({
inline:true,
});
$('#datetimepicker4').datetimepicker();
$('#open').click(function(){
$('#datetimepicker4').datetimepicker('show');
});
$('#close').click(function(){
$('#datetimepicker4').datetimepicker('hide');
});
$('#datetimepicker5').datetimepicker({
datepicker:false,
allowTimes:['12:00','13:00','15:00','17:00','17:05','17:20','19:00','20:00'],
});
$('#datetimepicker6').datetimepicker();
$('#destroy').click(function(){
if( $('#datetimepicker6').data('xdsoft_datetimepicker') ){
$('#datetimepicker6').datetimepicker('destroy');
this.value = 'create';
}else{
$('#datetimepicker6').datetimepicker();
this.value = 'destroy';
}
});
</script>
</html>