Multiple Date Formats

This technique is particularly useful if you wish to show a locale oriented display to the user, but your backend has specific, multiple, date format requirements. (CakePHP for instance).

If you simply need a single extra format in something like a hidden input element, please read the api pages for “linkedField” and “linkedFieldFormat

The output of the demo here is show in “text” inputs, but it could just as easily be “hidden” inputs.

Extra output

Source Code

HTML

<div class="form-group">
  <label for="date">User Date</label>
  <input type="text" id="date" data-role="datebox" data-options='{
    "mode":"calbox",
    "closeCallback":"formatter"
  }'>
</div>

jQuery

function formatter(obby) {
  var date = obby.date;
  $('#out1').val(this.callFormat('%Y-%m-%d', date));
  $('#out2').val(this.callFormat('%-d', date));
  $('#out3').val(this.callFormat('%-m', date));
  $('#out4').val(this.callFormat('%Y', date));
}