Cijeli primjer jQuery UI datepicker-a:
<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<title>jQuiery UI - kalendar</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/blitzer/jquery-ui.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8" type="text/javascript">
window.jQuery || document.write('<script type="text/javascript" src="/js/jquery/1.7.1/jquery-1.7.1.min.js"><\/script>');
</script>
<script type="text/javascript" charset="utf-8" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script type="text/javascript">
window.jQuery.ui || document.write('<script type="text/javascript" src="/js/jquery_ui/1.8.17/jquery-ui.1.8.17.min.js"><\/script>');
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/i18n/jquery.ui.datepicker-hr.js"></script>
<script type="text/javascript">
window.jQuery.ui || document.write('<script type="text/javascript" src="/js/jquery_ui/1.8.17/i18n/jquery-ui-i18n.min.js"><\/script>');
</script>
<script type="text/javascript" charset="utf-8">
var datumvrijeme = new Date();
var mjesec = datumvrijeme.getMonth() + 1;
var dan = datumvrijeme.getDate();
var godina = datumvrijeme.getFullYear();
var sati = datumvrijeme.getHours();
var minuta = datumvrijeme.getMinutes();
var sekundi = datumvrijeme.getSeconds();
if(mjesec<10){
mjesec="0"+mjesec;
}
if(dan<10){
dan="0"+dan;
}
if(sati<10){
sati="0"+sati;
}
if (minuta<10){
minuta="0"+minuta;
}
if (sekundi<10){
sekundi="0"+sekundi;
}
var datum=dan+'.'+mjesec+'.'+godina+'.';
var vrijeme=sati+':'+minuta+':'+sekundi;
$(document).ready(function(){
var datePickerOpcije={
showButtonPanel: true,
changeYear: true,
changeMonth: true
}
$('#datum').datepicker(datePickerOpcije);
});
function datum_vrijeme()
{
document.getElementById('datum').value = datum;
document.getElementById('vrijeme').value = vrijeme;
}
</script>
</head>
<body onload="datum_vrijeme();">
<form method="POST" action="akcija.php">
<input name="datum" id="datum" value=""/> datum
<input name="vrijeme" id="vrijeme" value=""/> vrijeme
</form>
</body>
</html>
