forked from wet-boew/wet-boew
-
Notifications
You must be signed in to change notification settings - Fork 0
Sélecteur de date
pjackson28 edited this page Sep 2, 2013
·
3 revisions
Ce composant permet de produire de façon dynamique une interface de calendrier pour sélectionner une date dans un formulaire.
Chef du projet : Stephane Berube (@berubs)
Le but de cette fonctionnalité est de fournir une interface pour sélectionner une date dans un formulaire.
Cette fonctionnalité offre un autre moyen de sélectionner une date dans un formulaire
- Ajouter un champ de saisie de texte pour chaque date qui sera demandée. Chaque champ de saisie de texte doit implémenter le type date.
-
Facultatif : Enrouler le format de date avec
<span class="datepicker-format"></span>pour le cacher lorsque le correctif ne charge (à cause du soutien natif). - Facultatif : Modifier la valeur de max pour indiquer la date la plus éloignée que peut sélectionner l’utilisateur.
- Facultatif : Modifier la valeur de min pour indiquer la date la plus proche que peut sélectionner l’utilisateur.
<div> <label for="startdate">Date de début<span class="datepicker-format"> (<abbr title="Les quatres chiffres de l'année">AAAA</abbr>-<abbr title="Les deux chiffres du mois">MM</abbr>-<abbr title="Les deux chiffres du jour">JJ</abbr>)<span> :</label> <input type="text" id="startdate" name="startdate" min="2008-01-01" max="2009-01-01" /> </div> <div> <label for="enddate">Date de fin<span class="datepicker-format"> (<abbr title="Les quatres chiffres de l'année">YYYY</abbr>-<abbr title="Les deux chiffres du mois">MM</abbr>-<abbr title="Les deux chiffres du jour">DD</abbr>)<span> :</label> <input type="text" id="enddate" name="enddate" min="2009-01-01" max="2010-01-01" /> </div>
Le sélecteur de date est dépendent sur le soutien natif pour l'élément input type="date" de HTML5, le correctif de sélecteur de date, et la bibliothèque calendar.
Le code pour le sélecteur de date se trouve à plusieurs endroits dans le répertoire source de la BOEW :
- js/workers/datepicker.js - contient le code JavaScript pour le correctif de sélecteur de date
- js/sass/includes/_datepicker.scss - contient le CSS pour le correctif de sélecteur de date
- js/images/datepicker/ - contient les images CSS pour le correctif de sélecteur de date
- js/dependencies/calendar.js - le fichier script du bibliothèque calendar
- js/sass/includes/_calendar-base.scss - le CSS de base du bibliothèque calendar
- js/sass/includes/_calendar-theme.scss - le CSS de thème du bibiliothèque calendar
- js/images/calendar/ - les images du bibiliothèque calendar
Il n’existe actuellement aucun problème connu.
N'hésitez pas à suggérer des améliorations.