jQuery UI DatePicker - Change Date Format

Question

I am using the UI DatePicker from jQuery UI as the stand alone picker. I have this code:

And the

Answer 1

This works too:

$("#datepicker").datepicker({
    dateFormat:'d-m-yy'
});

Answer 2

Try to use the

$( ".selector" ).datepicker({ dateFormat: 'dd/mm/yy' });  

and there is lots of option available For the datepicker you can find it Here

http://api.jqueryui.com/datepicker/

This is the way we call the datepicker with the parameter

$(function() {
      $('.selector').datepicker({
            dateFormat: 'dd/mm/yy',
            changeMonth: true,
            numberOfMonths: 1,
            buttonImage: 'contact/calendar/calendar.gif',
            buttonImageOnly: true,
            onSelect: function(selectedDate) {
                 // we can write code here 
             }
      });
});

Answer 3

Here's one specific for your code:

var date = $('#datepicker').datepicker({ dateFormat: 'dd-mm-yy' }).val();

More general info available here:

• http://api.jqueryui.com/datepicker/#option-dateFormat
• http://api.jqueryui.com/datepicker/#utility-formatDate

Answer 4

you can simply use this format in you function just like

     $(function() {  
        $( "#datepicker" ).datepicker({
            dateFormat: 'dd/mm/yy',
          changeMonth: true,
          changeYear: true
        });
      });

<input type="text" id="datepicker"></p>

Answer 5

<script>
    $(function() {  
        $("#datepicker").datepicker(); 
        $('#datepicker').datepicker('option', {dateFormat: 'd MM y'});
    }); 
    $("#startDate").datepicker({dateFormat: 'd MM y'}); 
</script>

Answer 6

I am using jquery for datepicker.These jqueries are used for that

<script src="jqueryCalendar/jquery-1.6.2.min.js"></script>
<script src="jqueryCalendar/jquery-ui-1.8.15.custom.min.js"></script>
<link rel="stylesheet" href="jqueryCalendar/jqueryCalendar.css">

Then you follow this code,

<script>
     jQuery(function() {
     jQuery( "#date" ).datepicker({ dateFormat: 'dd/mm/yy' });
                });
</script>