====== Datepicker ====== ====== Installation ====== Utiliser jqueryUI et le fichier jquery.ui.datepicker-fr.js pour avoir les dates en français /* 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 */ jQuery(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', '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']); }); Ensuite mettez un champ texte Et le code jquery qui va bien $( "#date" ).datepicker({ dateFormat: "dd-mm-yy", changeMonth: true, changeYear: true, showOtherMonths: true, selectOtherMonths: true, onSelect: function(date){ location.href='?date='+date; } }); Dans cet exemple, on change de page lorsque l'on sélectionne une date en passant la valeur de date dans l'url ===== exemple pour gérer des dates ===== $('#camera_next').click(function(){ if($('#heure option:selected').next().val()==undefined){ heure='0300'; date_photo=$( "#date_photo" ).datepicker('getDate'); jour=$.datepicker.formatDate( "yymmdd", new Date(date_photo.getFullYear(), date_photo.getMonth(), date_photo.getDate()+1 ) ); $("#date_photo").datepicker('setDate',$.datepicker.formatDate( "dd/mm/yy", new Date(date_photo.getFullYear(), date_photo.getMonth(), date_photo.getDate()+1 ) ) ); $("#heure").val(heure); }else{ d=$('#date_photo').val(); jour=d.substr(6,4)+d.substr(3,2)+d.substr(0,2); heure=$('#heure option:selected').next().val(); $("#heure").val(heure); } $('#photoreel').attr('src','http://transalpair.eu/smm/photos/Pict_'+jour+'_'+heure+'.jpg'); $('#photolien').attr('href','http://transalpair.eu/smm/photos/Pict_'+jour+'_'+heure+'.jpg'); }); $('#camera_prev').click(function(){ if($('#heure option:selected').prev().val()==undefined){ heure='2100'; date_photo=$( "#date_photo" ).datepicker('getDate'); jour=$.datepicker.formatDate( "yymmdd", new Date(date_photo.getFullYear(), date_photo.getMonth(), date_photo.getDate()-1 ) ); $("#date_photo").datepicker('setDate',$.datepicker.formatDate( "dd/mm/yy", new Date(date_photo.getFullYear(), date_photo.getMonth(), date_photo.getDate()-1 ) ) ); $("#heure").val(heure); }else{ d=$('#date_photo').val(); jour=d.substr(6,4)+d.substr(3,2)+d.substr(0,2); heure=$('#heure option:selected').prev().val(); $("#heure").val(heure); } $('#photoreel').attr('src','http://transalpair.eu/smm/photos/Pict_'+jour+'_'+heure+'.jpg'); $('#photolien').attr('href','http://transalpair.eu/smm/photos/Pict_'+jour+'_'+heure+'.jpg'); });