Affichage donnée switch box
Bonjour,
J'ai un switch box (ON/OFF) et j'aimerais afficher les données en fonction que le switch est à ON ou à OFF tout ça tant qu'il y a des données dans la BD.
Présentement mon switch affiche ou non un DIV, mais seulement de ma première ligne de Bd.
Voici 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
| //Acces BD
<?php
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
$sql = "SELECT * FROM table";
$result = $conn->query($sql);
while($row = mysqli_fetch_array($result))
{ ?>
<?php echo '<div id="'.$row["urlName"].'content">'; ?>
// Div à afficher ou non
<div id="description1" style="display:none"><?php echo '<p>'.$row["description1"].'</p>'; ?></div>
<div id="description2" style="display:block"><?php echo '<p>'.$row["description2"].'</p>'; ?></div>
// Switch Box
<label class="switch">
<input type="checkbox" onclick="change()">
<span class="slider round">
<h1 id="light-text" style="display:none">ON</h1>
<h1 id="on" style="position:relative;left:-85px;bottom: 25px;font-size:18px;">On</h1>
<h1 id="off" style="position:relative;left:70px;bottom: 65px;font-size:18px;">OFF</h1>
</span>
</label>
// Code Javascript
<script>
function change() {
var x = document.getElementById("light-text");
var description1 = document.getElementById("description1");
var description2= document.getElementById("description2");
if (x.innerHTML === "ON") {
x.innerHTML = "OFF";
description1.style.display = "block";
description2.style.display = "none";
} else {
x.innerHTML = "ON";
description1.style.display = "none";
description2.style.display = "block";
}
}
</script>
<?php }
$conn->close();
?> |
Qui serait en mesure de me donner, ou m'aiguiller, vers une solution?
Merci
