Multiples JSCalendar indépendants

**hsmr** · 30/12/2011, 23h52

Bonsoir et Joyeux Noël!

Je voudrais utiliser plusieurs JSCalendar sur un site web.
Un bout de code javascript (ci-dessous) permet d'ajouter dynamiquement un bloc contenant un champ de type 'input' pour la date et un autre de type 'input' pour le contenu. Entre les deux, un bouton permettant d'afficher le calendrier sous forme de popup et de pouvoir sélectionner la date.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type="text/javascript">
      var counter=1;
      $('.ajouter').click(function(){
         var newDetailBoxDiv = $(document.createElement('div')).attr("id", 'DetailBoxDiv' + counter);
         newDetailBoxDiv.html('<div class="date">' +
                              '	Date&nbsp;&nbsp;<input type="text" name="date" id="calendar-field[' + counter + ']" \/>' +
                              '	<button id="calendar-trigger[' + counter + ']">...<\/button>' +
                              '	<script>' +
                              '		Calendar.setup({inputField:"calendar-field[' + counter + ']",trigger:"calendar-trigger[' + counter + ']",onSelect   : function() { this.hide() }});' +
                              '	<\/script>' +
                              '<\/div>' +
                              '<div class="contenu">Contenu <input type="text" class="texte" name="contenu" \/><\/div>');
 
         newDetailBoxDiv.appendTo("#detail_programme");
	 counter++;
      });
</script>

Seulement voilà, seul le premier bloc (écrit en dur dans ma page php) fonctionne. Aucun des blocs suivants ajoutés dynamiquement ne fonctionnent. Lorsque je clique sur le bouton destiné à afficher le calendrier, ce dernier ne s'affiche pas et l'erreur javascript que j'ai est la suivante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part