J'extrais d'une table image (img), le chemin de toutes les images qui viennent d'être partagées par les utilisateurs pour qu'elles soient (ou non) validées et accessibles à tous ensuite.
Je prends l'id, le chemin (path_img1020) et la description saisie par l'utilisateur.
Je fais une boucle pour afficher toutes les images concernées.

Le click sur une photo permet de créer un modal contenant l'image à valider.

Le souci : je ne parviens pas à ajouter un bouton sur l'image du modal qui déclencherait le script de validation.

Code html : 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
<?php
$servername = 'localhost';
$username = 'root';
$bidule = '';
$dbname = 'photos';
$conn = new mysqli($servername, $username, $bidule, $dbname);
if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
}
$result = $conn->query('SELECT id, path_img, path_img400, path_img1020, description FROM img WHERE reachable = 0;') ;
if (!$result) {
        die('<p>error invalid : '.$conn->error.'</p>');
}
?>
<!DOCTYPE html>
<html>
	<title>To validate</title>
	<head>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="w3.css">
	</head>
	<body>
		<div class="w3-container w3-teal">
			<h1>List of photos to validate</h1>
		</div>
		<div class="row w3-center">
			<div class="w3-row-padding w3-margin-top">
                                <!-- Itération sur chacune des images concernées -->
				<?php
                                for ($i=0 ; $i < $result->num_rows ; $i++) {
                                        $row = $result->fetch_assoc() ;
                                        $id = $row['id'];
                                        $path_img = $row['path_img'];
                                        $path_img400 = $row['path_img400'];
                                        $path_img1020 = $row['path_img1020'];
                                        $description = $row['description'];
                                        // Visualisation des images à l'écran
                                        echo '<img src="' . $path_img1020 . '" style="width:100%;max-width:400px;cursor:pointer" onclick="onClick(this)" class="w3-margin w3-hover-sepia">';
                                }
                                $result->free();
                                ?>
			</div>
		</div>
                <!-- Création du modal -->
		<div id="modal01" class="w3-modal w3-dark-grey" onclick='this.style.display="none"'>
			<span class="w3-button w3-hover-red w3-xlarge w3-display-topright">&times;</span>
			<div class="w3-modal-content w3-animate-opacity">
				<img id="img01" style="width:100%">
			</div>
		</div>
		<script>
                        function onClick(element) {
                                document.getElementById("img01").src = element.src;
                                document.getElementById("modal01").style.display = "block";
                        }
                </script>
	</body>
</html>