Search code examples
jquerydatejquery-uidatepicker

JQuery Datepicker date format - How to change from dd/mm/yyyy to dd/mm/yy?

I have used JQuery Datepicker where the date format is dd/mm/yyyy. I would like the date to be displayed as dd/mm/yy.

Eg. Instead of 15/07/2017, I would like the date to be shown as 15/07/17 in the datepicker.

This is how I am calling the JQuery datepicker, but it is not formating the date as per my need. 

$( ".startdate" ).datepicker({
    dateFormat: 'dd-mm-yy',
    changeMonth: true,
    changeYear: true
});

Is there any inbuilt option for this date format? Or is there a way to create a custom date format according to our own needs.

Solution

  • You need to do like below:-

    $( ".startdate" ).datepicker({
    dateFormat: 'dd/mm/y',//check change
    changeMonth: true,
    changeYear: true
});

    Example:-

    $(".startdate").datepicker({
  dateFormat: 'dd/mm/y', //check change
  changeMonth: true,
  changeYear: true
});
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.js" data-modules="effect effect-bounce effect-blind effect-bounce effect-clip effect-drop effect-fold effect-slide"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />


<h4>Datepicker with Date Format (dd/mm/y) using JQuery</h4>
<p>Date picker: <input type="text" class="startdate" size="30" /></p>
<p> Date Format : dd/mm/y</p>