Discussion :

[City-zen]

Bonjour,

Au lieu de vous expliquer longuement ce que je cherche à faire, je vous invite à regarder l'exemple que j'ai trouvé provenant d'un site de réparation de smartphone, tablettes etc.

http://www.phoneglass.fr/reparation/atelier.html

Descendre en bas de la page.

J'aimerais savoir si un code JavaScript de ce type à déjà était mis en place par l'un d'entre vous?

Merci d'avance.

[Benjamin Delespierre]

Non mais je ne vois rien de bien méchant à faire: un coup d'ajax pour aller de mois en mois et un évènement pour le click sur une plage horaire de réservation.

[City-zen]

Merci de ta réponse,

Je pense qu'on est loin d'avoir le même niveau^^

J'ai essayé de reproduire la mise en forme de l'exemple que j'ai donné dans un tableau html, dans lequel seul les dates en début de ligne varient tout les jours. La première ligne de chaque colonne correspond à une heure. Le reste du tableau ne contient que des images. Lors du clique sur une image, je pourrais récupérer toutes les infos dont j'ai besoin (date et heure).

Je ne compte pas permettre le changement de mois.

Par contre j'aimerais savoir comment mis prendre en Ajax pour permettre simplement à la personne de pouvoir cliquer à plusieurs endroit différents et de récupérer seulement les valeurs du créneau choisi lors de la validation.

Je pense utiliser la méthode POST pour récupérer les données.

Désolé de te déranger avec des questions aussi simples mais je réalise actuellement mon premier site.

[Benjamin Delespierre]

Ah d'accord, on peut pas dire que tu aies choisi la facilité pour débuter

Qu'a cela ne tienne: une solution simple consiste à faire porter sur les cellules (td) de ton tableau un timestamp (qui correspond à la date / heure) dans un attribut arbitraire. Ensuite, au clic sur cette cellule, cette donnée sera lue et insérée en tant que champ masqué dans un formulaire. Ainsi, l'utilisateur pourra cliquer autant de plages horaires qu'il veut.

Voici à quoi ça peut ressembler avec du jQuery:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<table id="plages">
  <tr>
     <td time="1311697530">&nbsp;</td>
     ...
  </tr>
  ...
</table>
<script type="text/javascript">
$('#plages td').click(function () {
  var timtestamp = $(this).attr('time');
  $('#formulaire').append('<input type="hidden" name="h[]" value="' + timestamp + '" />');
});
</script>

[City-zen]

Encore merci pour ta réponse.

J'essaie actuellement de la mettre en place.

Je viens de réaliser que je vais rencontrer un autre problème concernant les dates.

Est-ce qu'il est possible d'exclure les Dimanches?

J'étais parti sur la gestion des dates suivante:

Code :

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

1
2
3
4
5
6
7
8
 
		<?php
				$demain_secondes = time() + (3600 * 24 * 4);
 
				$dateDuJour = $jour[date("w",$demain_secondes)]." ".date("d",$demain_secondes)." ".$mois[date("n",$demain_secondes)]." ".date("Y",$demain_secondes);
 
				echo $dateDuJour;
		?>

[City-zen]

J'ai testé ce que tu m'as passé.
J'ai passé le input en type text pour faire des tests.

Il ne s'affiche pas et rien ne se passe lors du clique. Il doit manquer quelque chose d'évident que tu n'as pas précisé.

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
 
<table  id="plages">
 
	<tr>
		<td time="1311697530">
			<img src="images/vert.png"/>
		</td>
        </tr>
 
</table>
 
 
	<script type="text/javascript">
		$('#plages td').click(function () {
		  var timtestamp = $(this).attr('time');
		  $('#formulaire').append('<input type="text" name="h[]" value="' + timestamp + '" />');
		});
	</script>
 
<form id="formulaire">
</form>