jQuery Timepicker example
jQuery Timepicker:
timepicker.html:
[html]
<html>
<head>
<link rel="stylesheet" media="all" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="http://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.js"></script>
<script src="http://trentrichardson.com/examples/timepicker/jquery-ui-sliderAccess.js"></script>
<script type="text/javascript">
$(function(){
$("#time").timepicker();
});
</script>
</head>
<body>
<input type=’text’ id="time" name=’date_of_birth’/>
</body>
</html>
[/html]
Output:
Timepicker Customized :
[html]
<html>
<head>
<link rel="stylesheet" media="all" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="http://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.js"></script>
<script src="http://trentrichardson.com/examples/timepicker/jquery-ui-sliderAccess.js"></script>
<script type="text/javascript">
$(function(){
var pickerTime = {
hourGrid: 5,
minuteGrid: 10,
timeFormat: ‘hh:mm tt’
};
$("#time").timepicker(pickerTime);
});
</script>
</head>
<body>
<input type=’text’ id="time" name=’date_of_birth’/>
</body>
</html>
[/html]
Output:
Recommended Books: