Jquery date picker - date format issue

Question

I am using the Jquery date picker to select a date. When I select a date the format of the date in the textbox is mm-dd-yyyy and I would like dd-mm-yyyy.

Textbox

Date: <input type="text" id="datepicker"/>

JQuery

$(function() {
$( "#datepicker" ).datepicker({ dateFormat: "dd/mm/yy"});
});

If I then adapt the text box by including a default date:

<input type="text" value="<?php echo date("d/m/Y"); ?>" id="datepicker" />

The default date appears as I would like in the input box ie dd/mm/yy, but when I open the date picker it takes this date as mm/dd/yy and therefore opens the date picker on the wrong date.

The text box and the picker do not seem to thinking in the same format. How do I correct this?

UPDATE

The issue is now:

1 - when I open the page the default date in textbox is correct and in the right format dd/mm/yy

2 - when I open the date picker the date picker goes to the correct date ie the default date

3 - when I then choose a date from the date picker the format reverts to mm/dd/yy in the text box

Does, when using JQuery to update an id, the format of the text box get bypassed in some way?

Answer 1

You've actually changed the type attribute of your input box to a date . Keep it as text and it should be fine:

<input type="text" value="<?php echo date("d/m/Y"); ?>" id="datepicker" />

Answer 2

Here's one specific for your code:

var date = $('#datepicker').datepicker("option", "dateFormat", "dd/mm/yy");

More general info available here:

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

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