Discussion :

[momototo38]

Bonjour,

Je souhaite activer un bloc (display: block) lorsque je choisi la journee correspondante dans un menu select.
A la base tout les blocs sont en display: none et lorsque je choisi un bloc c'est a dire une journee grace a la fonction javascript je souhaite qu'il devienne en display: block.
J'arrive a le faire pour des liens avec onclick mais pour un menu select je sais pas du tout.

mon code:

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
<form id="formweek">
	<select name="week">
		<option selected onSelect="weekshow(document.getElementById('day1'))">Journée 1</option>
		<option value="Journee 2" onSelect="weekshow(document.getElementById('day2'))">Journée 2</option>
		<option value="Journee 3" onSelect="weekshow(document.getElementById('day3'))">Journée 3</option>
		<option value="Journee 4" onSelect="weekshow(document.getElementById('day4'))">Journée 4</option>
	</select>
</form>
 
<?php 
        try
        {
                $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
                $bdd = new PDO('mysql:host=localhost;dbname=xxx', 'xxx', 'xxx', $pdo_options);
        }
        catch(Exception $e)
        {
                die('Erreur : '.$e->getMessage());
        }
                $req = $bdd->query('SELECT video_match.journee_id, video_match.date, video_match.score,
                                                        equipe1.id AS equipe1_id,
                                                        equipe1.nom AS equipe1_nom,
                                                        equipe2.id AS equipe2_id,
                                                        equipe2.nom AS equipe2_nom
                                                        FROM video_match
                                                        JOIN video_ligue ON video_ligue.id = video_match.ligue_id
                                                        JOIN video_journee ON video_journee.id = video_match.journee_id
                                                        JOIN video_equipe AS equipe1 ON equipe1.id = video_match.equipe1_id
                                                        JOIN video_equipe AS equipe2 ON equipe2.id = video_match.equipe2_id
                                                        WHERE video_ligue.id = 1
                                                        ORDER BY video_match.journee_id');
                                                        
                $i = null;
                $j = 1;
                
                while($donnees = $req->fetch())
                { 
                        
                        if($i == null)
                        {
                                $i = $donnees['journee_id'];
                                echo '<div class="match" name="match" id="day'.$j.'" style="display: none;">';
                                $j++;
                        }
                        if ($i != $donnees['journee_id']) 
                        {
                                echo '</div><div class="match" name="match" id="day'.$j.'" style="display: none;">';
                                $i = $donnees['journee_id'];
                        }
?>
		<div class="matchx">
		<table>
		<tr>
			<div class="date"><?php echo $donnees['date']; ?></div>
		</tr>
		<tr>
			<td class="gauche"><span class="teamone"><?php echo $donnees['equipe1_nom']; ?></span></td>
			<td class="centre"><a href="" class="score"><?php echo $donnees['score']; ?></a></td>
			<td class="droite"><span class="teamtwo"><?php  echo $donnees['equipe2_nom']; ?></span></td>
		</tr>
		</table>
		</div>
<?php
                }
                        echo '</div>';
?>

fonction javascript weekshow:

Code :

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

1
2
3
4
5
6
7
8
9
 
function weekshow(element){
var elements = document.querySelectorAll('div[name="match"]');
var i = 0, li = elements.length; 
	for	(i = 0 ; i < li ; i++){
		elements[i].style.display='none';
	}
element.style.display='block';
}

1°) Est-il possible de faire ce que je veux?
2°) Doit je le faire avec "onSelect"? sinon comment faire?

Merci d'avance de votre aide

[MaitreKaio]

1) C'est possible oui, et je dirais même que tu as fait le plus dur si tu sais le faire sur le clic d'un lien.
2) Il n'y a pas d'événement 'select' sur une des options, mais un événement 'change' sur la boite de sélection elle-même. Pour savoir quelle option a été sélectionnée, tu peux ensuite utiliser la propriété 'selectedIndex' pour savoir quelle option a été sélectionnée, ou bien déterminer quelle option a la propriété 'selected'