afficher/cacher un block menu select
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:
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:
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