installing a jQueryUI datepicker with internal ISO date format, but different display format

datepicker-iso8601.js

// detect if datepicker required (no input type="date" ...)
if ( $('[type="date"]').prop('type') != 'date' ) {
      installDatePicker('dd-M-yy'); // note: with jQui datepicker, 'yy' is 4-digit year  
}   


// installs a jQueryUI datepicker in place of <input type="date">:
  function installDatePicker(displayFormat) {
    $('input[type=date]').each(function (index, element) {
      var hiddenDate = $(this).clone().insertAfter(this).hide(); // create hidden date field that will contain the iso 8601 date format
      $(this).attr('id',$(this).attr('id')+'-displayed'); // append '-displayed' to the id of the date field which the user sees
      $(this).datepicker({ 
        dateFormat: 'dd-M-yy', 
        altField: '#' + hiddenDate.attr('id'), 
        altFormat: 'yy-mm-dd', // full-date as specified in RFC3339 (note: 'yy' is actually 4-digit year in datepicker)
        onSelect: function() { 
          hiddenDate.trigger("change"); 
        } // make datepicker fire a change event when underlying input changed (doesn't do this by default)
      }); 
    });
  }