Un configurateur de calendrier Javascript est disponible si vous cherchez quelque chose de plus facile à intégrer.
La fonction se charge d'initialiser l'objet jsSimpleDatePickr et d'ajouter les différents éléments nécessaires :
- Le calendrier
- Les boutons de navigation
- Le nom et l'année du mois en cours
- Un bouton (<input type="button">) pour afficher / masquer le calendrier (facultatif)
Vous définissez les paramètres suivant :
- L'ID du bloc div dans lequel la fonction va afficher le calendrier et les boutons de navigation
- Le texte du bouton qui va afficher / masquer le calendrier. La fonction crée ce bouton elle même. Il est facultatif si vous passez un texte vide ("") la fonction n'ajoute pas de bouton, mais va rajouter un évênement onclick sur le champ de texte dans lequel la date sera affiché.
- Le champ de texte dans lequel la date sera affiché.
- Class css du tableau dans lequel sera affiché le calendrier
- Class css d'un jour du mois affiché (la class n'est appliquée que pour les jours du mois)
- Class css du jour sélectionné
HTML
<p>Date : <input type="text" value="" name="date" id="champ_date" size="12" maxlength="10"></p>
<div id="calendarMain"></div>
<script type="text/javascript">
//<![CDATA[
calInit("calendarMain", "", "champ_date", "jsCalendar", "day", "selectedDay");
//]]>
</script>
Exemple
Cliquez ici pour voir l'exemple