Updating an additional input element

There may be times when we want to update two <input> elements with the selected date, perhaps to show a different date format. The altField and altFormat options can be used to cater to this requirement. Add a second <input> element to the page in datepicker16.html with an id attribute of dateAltDisplay, and then change the configuration object to the following:

$("#date").datepicker({
  altField: "#dateAltDisplay",
  altFormat: $.datepicker.TIMESTAMP
});

Save this as datePicker17.html. The altField option accepts a standard jQuery selector as its value, and allows us to select the additional <input> element that is updated when the main <input> is updated. The altFormat option can accept the same formats as the dateFormat option. The following screenshot shows how the page should appear, once a date has been selected using the datepicker: