Discussion :

[Djeros]

Salut � toutes et � tous,
j'ai mis en place un calendrier dans lequel l'utilisateur s�lectionne les dates qui l'int�ressent en cliquant dessus, ce qui change leur couleur. Puis, en validant le calendrier, elles apparaissent dans un formulaire � c�t� du calendrier, par ordre croissant, une par une, sous la forme, par exemple, '30 mars 2014'.

Si l'utilisateur s�lectionne plusieurs jours cons�cutifs, je souhaiterais que ceux-ci apparaissent r�capitul�s au sein de expression "Du ... au" , non pas un par un comme c'est le cas en ce moment.

Quelqu'un a-t-il une id�e sur ce que dois faire pour obtenir ce r�sultat ? Merci � tous pour vos apports , bon dimanche - et n'oubliez pas de voter !,

Djeros

PD : Le calendrier en question a �t� d�velopp� par Nick Baicoianu. Vous pouvez le trouver ici : http://www.javascriptkit.com/script/...ch/index.shtml
Je l'ai reskinn� et modifi� pour l'adapter � mes besoins.

[SylvainPV]

Bonjour

Dans l'ordre logique, ce serait :

1) r�cup�rer les dates s�lectionn�es sous forme d'Array
2) les trier par date croissante (a priori c'est fait)
3) dans la partie du code responsable de ton affichage "dans le formulaire � c�t�", v�rifier qu'elles correspondent � une plage de jours cons�cutive
4) si c'est le cas, g�n�rer comme HTML : "Du "+mesDates[0]+" au "+mesDates[mesDates.length - 1], sinon laisser la g�n�ration telle qu'actuellement

Dis-nous � quelle �tape tu bloques, en indiquant le code que tu as essay�.

[Djeros]

Salut � toi SylvainPV,
l'�tape que je n'arrive pas � passer, est pr�cis�ment la cr�ation de la fonction qui identifiera les dates comme �tant cons�cutives. Pour info, voici la partie de code qui g�re tout �a, c'est-�-dire, mise en forme des dates en fran�ais avec noms de jours, tri par date croissante, affichage dans la zone o� je mettrai le formulaire et insertion dans le container (une div) :

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
18
19
20
21
validSelected.onclick = function validDate() {
  this.owner.selectedDates.sort(function (a, b) { // Pour trier les dates - To sort the dates by crescent order
    if (a < b) {
      return -1;
    } else if (a > b) {
      return 1;
    } else {
      return 0;
    };
  });
  // Mets les dates dans le paragraphe créé - Put the selected dates in the created <p>
  document.getElementById('paragraph').innerHTML = this.owner.selectedDates.toLocaleString().replace(/ 00:00:00,*/g, '<br />');
  //this.owner.selectedDates.toLocaleString().replace(/ 00:00:00,*/g, '\n')); 	// Affiche la date au format français et enlève les hh/mm/ss
  // Display the date in a french format and remove hh/mm/ss
};
 
container.appendChild(clearSelected);
container.appendChild(validSelected);
container.appendChild(paragraph);
 
return container;

Voilou,

[Djeros]

Bonsoir,
je n'ai pas beaucoup avanc� sur mon probl�me car je ne sais pas du tout comment le formaliser en une fonction.

Par contre, il faut que je prenne en compte deux autres possibilit�s, � savoir, que l'utilisateur puisse s�lectionner quelques dates qui seront cons�cutives et d'autre pas, mais aussi plusieurs groupes de dates cons�cutives s�par�s par un ou plusieurs jours.
Ce dernier cas sera donc trait� par la fonction ... que je n'arrive pas � faire, et qui renverrai alors deux/des phrase du type : 'du ... au ' et 'du ... au'.

En r�sum�, cela donnerait :
1- Tri de toutes les dates
2- Voir s'il y a des jours cons�cutifs (AAArgg ...)
3- Cr�er un/des tableaux constitu� des jours cons�cutifs
4- Dans le premier tableau, enlever autant d'�l�ments que de jours cons�cutifs
5- Re-g�n�rer le premier tableau
6- Formatage des dates
7- Les afficher avec innerHTML ='du'+ss-tab[jour0]+'au' etc .

Voila, quelque chose comme �a. Mais il se fait tard, je continuerai demain, Tchouss,

Djeros

[SylvainPV]

selectedDates est une Array de Date, pas une seule Date. C'est pour �a que toLocaleDateString ne donnait rien dans l'autre topic.

Je ne peux pas tester car je n'ai pas tout ton code, mais � l'instinct j'aurais fait comme �a :

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
18
19
20
21
22
23
24
25
26
27
28
29
validSelected.onclick = function validDate() {    
    var aDayLong = 24*3600*1000;
    var intervals = [];
    var lastDate = null;
 
    this.owner.selectedDates.sort(function (a, b){ return a-b;    });    
 
    for(var d=0, l=this.owner.selectedDates.length; d<l; d++){
        var date = this.owner.selectedDates[d];
        if(lastDate != null && date-lastDate <= aDayLong){
            intervals[intervals.length - 1].push(date);
        } else {
            intervals.push([ date ]);
        }
        lastDate = date;
    }
 
 
    document.getElementById('paragraph').innerHTML = intervals.map(function(interval){
        if(interval.length === 1){
           return interval[0].toLocaleDateString();
        } else {
           return "Du " + interval[0].toLocaleDateString() 
                + " au " + interval[interval.length - 1].toLocaleDateString();
        }     
    }).join("<br>");
 
 
};

[Djeros]

Bonjour Sylvain,
me revoilu, frais et dispos. Je vais de ce pas r�ins�rer ce que tu m'as envoy� pour voir ce qui se passe et je tiens au courant.

En tout cas, d'ores et d�j� un grand merci pour ton attention ; je d�bute en js. - et en programmation tout court, et toute aide qui m'est accord�e est un encouragement qui me donne du c�ur � l'ouvrage.

A plus tard pour des nouvelles du calendrier,

Djeros