Bonjour,

J'ai récupéré un module permettant l'ajout d'un commentaire sur un article d'un site. Il s'agit en effet d'une fonction qui peut être appelée dans les pages proposant un article sur lequel l'internaute peut réagir. Le module est composé de :

-Une feuille de style : commentaire.css
Code css : 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
input[type=text]{padding:10px;height:40px;width:280px;border:1px solid #E7E7E7;border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-family:'Futura', "Trebuchet MS", Helvetica, Verdana, sans-serif, Arial;}
input[type=text]:hover{background-color:#f8fbff;}
textarea{padding:10px;border:1px solid #E7E7E7;border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;height:125px;}
/*.box-light{padding:25px;color:#333333;margin:10px 0;background:#ffffff;transition:all 0.6s ease 0s;}*/
.box-light{padding:0px;color:#333333;margin:10px 0;background:#ffffff;transition:all 0.6s ease 0s;}
.box-light .box-light{padding:0 35px;}
.box-light .box-light p{margin:5px 0px;}
.box-light h2,.box-light h3,.box-light h4{margin:0;padding:0; text-align:left !important;}
.box-light h3{margin-top:10px;}
.box-light h3 a{text-decoration:none;}
.box-light img{transition:all 0.6s ease 0s;display:block;}
.box-light:hover{box-shadow:1px 1px 10px #dcdcdc;}
.box-light .box-light:hover{box-shadow:none;}
.box-light p{padding:0;}
.letter{background-color:#4C74AD;color:#ffffff !important;border-radius:50%;width:40px;height:40px;line-height:35px;font-weight:bold;text-align:center;float:left;margin-left:-35px;margin-right:15px;}
.letter.blue{background-color:#3B689F;}
.letter.green{background-color:#44A437;}
.letter.orange{background-color:#ff7537;}
.letter.purple{background-color:#b99aff;}
.letter.gray{background-color:#888888;}
.letter.red{background-color:#DC4739;}
.chapeau{font-size:1em;margin:5px 0;font-weight:bold;}
.gray{color:#888888;}
.red{color:#DC4739;}
.hidden{display:none;}
.clear{clear:both;}
.separator{border-top:1px solid #e7e7e7;border-bottom:1px solid #ffffff;width:100%;height:1px;margin-top:30px;margin-bottom:30px;clear:both;}
.button-blue{margin-top:10px;float:right;font-family:Arial;cursor:pointer;font-size:1em;padding:10px 15px;font-weight:bold;border-radius:5px;color:#ffffff;border:0px;background:#3e679b;box-sizing:border-box;text-align:center;}
.repondre{}
.repondre a:link,.repondre a:visited{text-decoration:none;}
.repondre a:hover{text-decoration:none;}
-Une page vue_commentaire.php
Code php : 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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
<?php session_start(); ?>
<?php 
	//--fonctions de sélection et d'insertion 
	function getBdd(){
		//--accès à la base de données
		//-------
		//-------
		//-------
		return $bdd;
	}
 
	//--affiche les commentaires d'un article
	function commentaires($url, $id_commentaire=0){
		//global $db;
		$bdd=getBdd();
		$i=0;
		$commentaires = '';
		$tcolor = ['blue','green','orange','purple','gray','red'];		
 
		$sql = "SELECT id_commentaire, nom, commentaire, email, date FROM Lescommentaires WHERE actif='y' AND id_article=$url";		
 
		if($id_commentaire!=0){ $sql .= " AND id_sous_commentaire=".$id_commentaire; }else{ $sql .= " AND id_sous_commentaire=0"; }
		$sql .= " ORDER BY id_sous_commentaire, date";
 
		foreach($bdd->query($sql) as $data) {
			$i++;
			mt_srand(crc32($data['email']));
 
			$commentaires .= '<div class="box-light">';
 
				if($i==1 && $id_commentaire==0)
				{
 
					$sql2 = "SELECT COUNT(id_commentaire) FROM Lescommentaires WHERE actif='y' AND id_article=$url";
					$query = $bdd->prepare($sql2); 
					$query->execute(); 
					$row = $query->fetch();
					$count = $row[0];
					$nb = $count;
					$s='s';
 
					if($count==1){ $nb = 'Un'; $s =''; }
 
					$commentaires .= '<h2>'.$nb.' commentaire'.$s.'</h2>';
				}
 
				$commentaires .= '<div class="separator"></div>
									<div class="box-light">
										<div class="letter '.$tcolor[mt_rand(0, count($tcolor) - 1)].'">'.htmlentities(substr($data['nom'], 0, 1)).'</div>
										<p class="chapeau">@'.htmlentities($data['nom']).' <span class="gray">'.$data['date'].'</span></p>
										<p>'.htmlentities($data['commentaire']).'</p>
										
											<input name="action" value="poster-commentaire" type="hidden">
											<input name="email" class="hidden" type="text">
											<input name="id_sous_commentaire" value="'.$data['id_commentaire'].'" type="hidden">
											<div id="comform-div-'.$data['id_commentaire'].'" class="comform-div hidden">
												<p>Réponse à @'.htmlentities($data['nom']).'<br><textarea name="commentaire"></textarea></p>
												<p>Nom<br><input name="nom" type="text"></p>
												<p>Adresse e-mail<br><input name="emailtrue" type="text"></p>
											</div>
											<div class="clear"></div>
											<p><a class="repondre" data-rel="'.$data['id_commentaire'].'" href="#" >Répondre</a></p>
											<div class="clear"></div>
										
									</div>';
 
				$commentaires .= commentaires($url, $data['id_commentaire']);
 
			$commentaires .= '</div>';
		}
		if($bdd){
			$bdd = NULL;
		}
		return $commentaires;
	}
 
	//--insertion d'un commentaire sur un article 
	function setCommentaire($id_sous_commentaire,$nom,$commentaire,$email,$id_article,$actif,$date,$adr_ip){
 
		$bdd=getBdd();
		$retour=FALSE;
 
		$sql="INSERT INTO Lescommentaires(id_sous_commentaire,nom,commentaire,email,id_article,actif,date, adr_ip) VALUE(:id_sous_commentaire,:nom,:commentaire,:email,:id_article,:actif,:date, :adr_ip)";
 
		try{
			$ltrait=$bdd->prepare($sql);
			$retour=$ltrait->execute(array('id_sous_commentaire'=>$id_sous_commentaire,'nom'=>$nom,'commentaire'=>$commentaire,'email'=>$email,'id_article'=>$id_article,'actif'=>$actif,'date'=>$date, 'adr_ip'=>$adr_ip));
 
		}catch(PDOException $e){
			echo "ERREUR INSERTION COMMENTAIRE BASE: setCommentaire() " .$e->getMessage() ."</br>";
		}
		if($retour==true){
			$trait=1;
		}
 
		return $trait;
 
		if($bdd){
			$bdd = NULL;
		}
 
	}
 
 
$varNumActu=$_SESSION['NUMERO_ACTU']; //--le numéro de l'actualité récupérée dans la page ouvrante
$adr_ip="125.125.125";//--en attendant de rendre dynamique
 
if(isset($_POST['action']) && $_POST['action']=='poster-commentaire')
	{
		// Protection robot
		if(isset($_POST['email']) && empty($_POST['email'])){
			if(isset($_POST['commentaire']) && !empty($_POST['commentaire']) &&	isset($_POST['nom']) && !empty($_POST['nom']) && isset($_POST['emailtrue']) && !empty($_POST['emailtrue']))
			{
				$id_sous_commentaire = 0;
 
				$_SESSION['COMMENTAIRE_ART_CONTRIB']=$_POST['commentaire'];
				$_SESSION['NOM_ART_CONTRIB']=$_POST['nom'];
				$_SESSION['EMAIL_ART_CONTRIB']=$_POST['emailtrue'];
 
				if(isset($_POST['id_sous_commentaire']) && is_numeric($_POST['id_sous_commentaire'])){ $id_sous_commentaire = intval($_POST['id_sous_commentaire']); }
 
				if(filter_var($_POST['emailtrue'], FILTER_VALIDATE_EMAIL)){
 
					$actif='a';
					$date=date("Y-m-d H:i:s");
					$email=$_POST['emailtrue'];
					$commentaire=$_POST['commentaire'];
					$nom=$_POST['nom'];
 
					$id_article=$varNumActu;//--à récupérer à l'ouverture de la page
 
					//--appel fonction d'insertion
					$lres=setCommentaire($id_sous_commentaire,$nom,$commentaire,$email,$id_article,$actif,$date,$adr_ip);
					if($lres==1){
						//--envoi d'un mail pour indiquer d'un nouveau commentaire
					}
					unset($_POST);
 
					$message_text = "Votre message a été déposé mais vous devez attendre qu\'il soit validé.";
					$message_img = "check";
				}
				else
				{
					$message_text = "Votre adresse e-mail n\'est pas valide !";
 
				}
			}
			else
			{
				$message_text = "Les informations obligatoires ne sont pas toutes renseignées !";
			}
		}
	}
 
 
?>
<!DOCTYPE HTML>
<html>
<head>
	<meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
	<link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap.min_2013.css" />
	<link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap.min.css" />	
	<link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap-responsive.min.css" />
	<link rel="stylesheet" type="text/css" href="../style/kmerlive.css" />
 
	<link rel="stylesheet" type="text/css" href="../style/commentaire.css" />
 
	<script src="../bootstrap/js/jquery-1.10.2.js"></script>
	<script src="../bootstrap/js/jquery-1.11.1.js"></script>
	<title>FaceFeet</title>
 
 
</head>
<body>
<div class="container">
	<div class="row-fluid">
                 <form method="post" action="vue_commentaire.php">
		<div class="span12">
			<?php 
				$url=$varNumActu;
				// Chargement des commentaires
				$commentaires = commentaires($url, 0);
				if(!empty($commentaires)){ echo '<div class="box-light">'.$commentaires.'</div>'; }										
			?>
		</div>
	</div>
 
	<div class="row-fluid">								
		<div class="span12 ">
			<hr style="background-color: #000;height: 2px;">
				<?="Informations";?>
			<hr style="background-color: #000;height: 2px;">
		</div>
		<div class="span12 " style="margin:0px !important;">
				<h3 style="text-align:left !important;">Poster un commentaire</h3>
 
					<input type="hidden" name="action" value="poster-commentaire" />
					<input type="hidden" name="idarticle" value="<?=$varNumActu;?>">
					<input type="text" name="email" class="hidden" />
					<p>Commentaire<br /><textarea name="commentaire"></textarea></p>
					<p>Nom<br /><input type="text" name="nom"  /></p>
					<p>Adresse e-mail<br /><input type="text" name="emailtrue" /></p>
					<p><input type="submit" class="button-blue left" value="Poster mon commentaire" /></p>
					<div class="clear"></div>												
					<p class="red right">Votre adresse e-mail n'est pas publiée lorsque vous ajoutez un commentaire.<br />Tous les champs sont obligatoires pour soumettre votre commentaire.</p>
					<div class="clear"></div>
				</form>	
		</div>
	</div>
</div>
<script>
<?php if(!empty($message_text)){ echo "alert('".$message_text."');"; } ?>
</script>
<script src="//code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
	$('.repondre').click(function(){
		var id = $(this).attr('data-rel');
		if($('#comform-div-' + id).hasClass('hidden'))
		{
			$('.repondre').removeClass('button-blue');
			$(this).addClass('button-blue').css('float','left');
			$('.comform-div').addClass('hidden');
			$('#comform-div-' + id).find('p').show();
			$('#comform-div-' + id).removeClass('hidden');
			return false;
		}
		else
		{
			$('#comform-' + id).submit();
			return false;
		}
	});
</script>
</body>
</html>
-Le code SQL pour créer la table
Code sql : 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
CREATE TABLE `Lescommentaires` (
  `id_commentaire` smallint(4) UNSIGNED NOT NULL,
  `id_sous_commentaire` smallint(4) UNSIGNED NOT NULL,
  `nom` varchar(50) COLLATE utf8_unicode_ci NOT NULL,
  `commentaire` text COLLATE utf8_unicode_ci NOT NULL,
  `email` varchar(150) COLLATE utf8_unicode_ci NOT NULL,
  `id_article` int(11) UNSIGNED NOT NULL,
  `actif` enum('y','n','a') COLLATE utf8_unicode_ci NOT NULL,
  `date` datetime NOT NULL,
  `adr_ip` varchar(20) COLLATE utf8_unicode_ci NOT NULL,
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
 
ALTER TABLE `Lescommentaires`
  ADD PRIMARY KEY (`id_commentaire`),
  ADD KEY `id_sous_commentaire` (`id_sous_commentaire`);
 
ALTER TABLE `Lescommentaires`
  MODIFY `id_commentaire` smallint(4) UNSIGNED NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=1;
J'ai utilisé ces codes puis crée la table. J'ai inséré un commentaire tout s'est passé avec succès. Pour afficher le commentaire de l'article, j'ai changé la propriété actif=y (dans la base), et le commentaire a bien été affiché.

Mon problème c'est lorsque je souhaite répondre à ce commentaire qu'il y a un souci :

-Le bouton "Répondre" n'est pas cliquable,

-J'ai fait un F12 et regardé l'onglet "Console" je n'ai rien qui est affiché pour me signaler une erreur.

Dans le fichier vue_commentaire.php, à la fin de page il y a un script JQuery quu est utilisé comme indiqué par le propriétaire du code (https://www.p3x.fr/atelier/scripts-d...os-articles-27)

Il me semble donc que c'est de là que peut provenir l'erreur, mais je n'ai pas beaucoup de notions sur du javascript, etc.

Peut-être quelqu'un peut m'aider à résoudre ce problème ? Je vous remercie d'avance.