Menu
I've been trying to change language shown by the datepicker. Default is english, I want to use french. I've got some results during searches but none seems working for me smh... I've tried those 1,2, 3, 4, 5 but still got no change in the language... I must be doing something wrong somewhere I guess
Here is a simplified version (yet all necessary information) of my code:
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/css/bootstrap-datepicker.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript" src="{{ asset('main/assets/js/main.js') }} "></script>
<script type="text/javascript" src="{{ asset('main/assets/js/jquery.min.js') }} "></script>
<script type="text/javascript" src=" {{ asset('main/assets/js/bootstrap.min.js') }}"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<script type="text/javascript" src=" {{ asset('main/assets/js/datepicker-fr.js') }}"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/js/bootstrap-datepicker.js"></script>
</head>
<body>
<input class="date form-control" type="text" id="datepicker" name="date" placeholder="Définir date limite de disponiblité de cette thématique">
<script>
$(function (){
$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
$('#datepicker').datepicker({
autoclose: true,
format: 'dd-mm-yyyy'
});
});
</script>
</body>
The referred datepicker-fr.js file is the one found here https://github.com/jquery/jquery-ui/blob/master/ui/i18n/datepicker-fr.js
According what I found on the net, I've successively changed my script to be :
<script>
$(function (){
$('#datepicker').datepicker( $.datepicker.regional[ "fr" ] );
});
</script>
<script>
$(function (){
$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
$('#datepicker').datepicker();
});
</script>
<script>
$(function (){
$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
$('#datepicker').datepicker({
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", "avr.", "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: ""
});
});
</script>
The date is still displaying in english and I'm not getting a problem shown in the console. What am I missing here? Your help would be very appreciated thanks
621
asked Sep 05 '25 03:09
Just include jQuery-Ui and set fr for default language, of course before init
$(function() {
$.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", "avr.", "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']);
$('#datepicker').datepicker();
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" integrity="sha256-rByPlHULObEjJ6XQxW/flG2r+22R5dKiAoef+aXWfik=" crossorigin="anonymous" />
<input id="datepicker" />If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
