<!-- the full contents of this file are included in the head block of your page -->
<!-- note to work we must start with the js/ directory, then the name of the folder -->

<!-- http://www.eyecon.ro/datepicker/#about -->

<link rel="stylesheet" href="js/datepicker/css/datepicker.css" type="text/css" />

<link rel="stylesheet" media="screen" type="text/css" href="js/datepicker/css/layout.css" />



<script type="text/javascript" src="js/datepicker/js/jquery.js"></script>

<script type="text/javascript" src="js/datepicker/js/datepicker.js"></script>

<script type="text/javascript" src="js/datepicker/js/eye.js"></script>

<script type="text/javascript" src="js/datepicker/js/utils.js"></script>


<script type="text/javascript">

//
// FIELD MUST BE CALLED DATE
//
  
$( document ).ready(function() {
  
  $('#date').val(getTodaysDate());
  
  $('#date').DatePicker({
     format:'m/d/Y',
     flat: false,
     date: $('#date').val(),
     current: $('#date').val(),
     starts: 1,
     position: 'r',
     onBeforeShow: function(){
       $('#date').DatePickerSetDate($('#date').val(), true);
     },
     onChange: function(formated, dates){
       $('#date').val(formated).DatePickerHide();
     }
    });

});

function getTodaysDate() {
  
  var today = new Date();
  var dd = today.getDate();
  var mm = today.getMonth()+1; //January is 0!
  var yyyy = today.getFullYear();
  
  if(dd<10) {
    dd='0'+dd
  } 
  
  if(mm<10) {
    mm='0'+mm
  } 
  
  today = mm+'/'+dd+'/'+yyyy;
  
  return today;
}

</script>