Arrivée le: Départ le:
Facilité le remplissage d’un champ de texte ‘Date’, en l’associant à un calendrier.
Pour cela nous avons besoin de faire appel au plugin JQuery ‘jquery.ui.datepicker-fr.js. En sélectionnant le champ ‘Date’ ci-dessus, le calendrier apparait (voir image ci-contre).
Plusieurs thèmes sont téléchargeables via ce lien. Il ne vous restera plus qu’a l’adapter à votre propre code.
David LAURENT
Code HTML
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<html> <head> <title>Default jQuery Datepicker</title> <link rel="stylesheet" type="text/css" href="css/jquery-ui.css"> <link rel="stylesheet" type="text/css" href="css/datepicker.css"> <script src="js/jquery-1.5.1.js"></script> <script src="js/jquery.ui.core.js"></script> <script src="js/jquery.ui.datepicker.js"></script> <script src="js/jquery.ui.datepicker-fr.js"></script> <script> $(function() { $( "#datepicker" ).datepicker(); }); </script> </head> <body> <div style=" width:250px; " class="datepicker"> <p style="font-size:small;">Date: <input type="text" id="datepicker"></p> </div> </body> </html> |
Voir le résultat en sélectionnant le champ ‘Date’
Aucun commentaire