Display date dd/mm/yyyy

Ive prepared a form with datepicker. I would like the date to display in format dd/mm/yyyy and also to display text in French.

Unfortunatly, the format is still mm/dd/yyyy and the datepicker is still in English.

the page is at www.leysart.com/lesnoisetiers/tarifs.php

What and where do I have to do changes ?

you need to add the date format, and translate the month, day names manually:

$(function(){
	$('#Arrive').datepicker({
		changeMonth: true,
		changeYear: true,
		onClose: closeDatePicker_Arrive,
		dateFormat:"dd/mm/yy",
		monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin',
    'Juillet','Août','Septembre','Octobre','Novembre','Décembre'],
   		monthNamesShort: ['Jan','Fév','Mar','Avr','Mai','Jun',
    'Jul','Aoû','Sep','Oct','Nov','Déc'],
    	dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
    	dayNamesShort: ['Dim','Lun','Mar','Mer','Jeu','Ven','Sam'],
    	dayNamesMin: ['Di','Lu','Ma','Me','Je','Ve','Sa'],
	});
});

I've inserted the script after the datepicker but that does not change anything

So, where do I have to add this script and how to call it so it works ?

there are also some localisation options for this widget, for which you also need to download the appropriate js file

http://jqueryui.com/datepicker/#localization

with the js file in place you can add the following line to the top of your script...

$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );

this will convert all instances of the datepicker to french

CraigR, Thanks for advise.

I went on the page but don't find what I'm supposed to download, install to do as you recomend

you need the js file from this page, (here it is below)

/* French initialisation for the jQuery UI date picker plugin. */
/* Written by Keith Wood (kbwood{at}iinet.com.au),
			  Stéphane Nahmani (sholby@sholby.net),
			  Stéphane Raimbault <stephane.raimbault@gmail.com> */
(function( factory ) {
	if ( typeof define === "function" && define.amd ) {

		// AMD. Register as an anonymous module.
		define([ "../jquery.ui.datepicker" ], factory );
	} else {

		// Browser globals
		factory( jQuery.datepicker );
	}
}(function( datepicker ) {
	datepicker.regional['fr'] = {
		closeText: 'Fermer',
		prevText: 'Précédent',
		nextText: 'Suivant',
		currentText: 'Aujourd\'hui',
		monthNames: ['janvier', 'février', 'mars', 'avril', 'mai', 'juin',
			'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre'],
		monthNamesShort: ['janv.', 'févr.', 'mars', 'avril', 'mai', 'juin',
			'juil.', 'août', 'sept.', 'oct.', 'nov.', 'déc.'],
		dayNames: ['dimanche', 'lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi'],
		dayNamesShort: ['dim.', 'lun.', 'mar.', 'mer.', 'jeu.', 'ven.', 'sam.'],
		dayNamesMin: ['D','L','M','M','J','V','S'],
		weekHeader: 'Sem.',
		dateFormat: 'dd/mm/yy',
		firstDay: 1,
		isRTL: false,
		showMonthAfterYear: false,
		yearSuffix: ''};
	datepicker.setDefaults(datepicker.regional['fr']);

	return datepicker.regional['fr'];

}));

)

save this with your other js files, and reference it in the head section of your page.

Once you have done this, you can add the following line at the beginning of the script which calls holds the datepicker function(s)

$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );

This will make all datepickers use french language as default.

(The script does pretty much the same thing as in Jason's reply, with a few additional settings)

Thanks for the help.

I,ve added the .js page with the code you gave me.

I then added the code in the .php page as you mentionned (see hereunder). But, the Datepicker is still in English with date mm/dd/yyyy (even after emptying the cache of my browsers).

So,I'm lost. (the page is www.leysart.com/lesnoisetiers/tarifs.php)

[code]
<script src="SpryAssets/i18n/jquery.ui.datepicker-fr.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#Arrive').datepicker($.datepicker.regional['fr']);
$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );

});
function closeDatePicker_Arrive() {
var tElm = $('#Arrive');
if (typeof Arrive_Spry != null && typeof Arrive_Spry != "undefined" && Arrive_Spry.validate) {
Arrive_Spry.validate();
}
tElm.blur();
}
</script>
[code]

your page is calling jquery.min.js and jquery-iu,js twice, which may be your problem

There was more than that in double, triple on the page. I don't know how that happend.

At least, now I've cleaned the code, the Datepicker works fine.

Thanks for your help

Glad you got it sorted