Afficher un commentaire posté en JS/AJAX

Fermé
delaville81 Messages postés 196 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 2 juin 2024 - 2 mai 2023 à 16:08
delaville81 Messages postés 196 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 2 juin 2024 - 2 mai 2023 à 17:45

Bonjour,

J'ai crée un blog. Dans ce dernier on peut créer des sujets et réagir en écrivant des commentaire.

Dans mon formulaire quand je clique sur publier, l'AJAX fonctionne et met bien à jour ma base de données mais le commentaire (dans la liste sous le sujet) ne s'affiche pas je reste sur mon imput.

Je souhaiterai faire comme dans comment ça marche (ce site) lorsqu'on post un sujet.

<form id="<?php echo 'formrep'.$suj['id_sujet']; ?>" method="POST" enctype="multipart/form-data">
    <input type="hidden" id="idSuj" class="" name="id_sujet" value="<?php echo $suj['id_sujet']; ?>"> 
    <input type="hidden" class="" name="id_membre" value="<?php echo $_SESSION['id_membre']; ?>"> 
    <input type="text" class="coment" name="texte_com" value="" placeholder="Votre commentaire..."> 
    <a class="btn_input"><i class="far fa-image "></i><span class="name">Photos</span></a>
    <input type="file" class="imgCom" id="imgFile_<?php echo $suj['id_sujet'];?>" name="img_com" lang="fr" accept=".jpg,.jpeg,.gif,.png" onchange="loadFileCom(event,<?php echo $suj['id_sujet'];?>)">
    <div class="img_com" id="divCom_<?php echo $suj['id_sujet'];?>"> 
        <img src="" id="outputCom_<?php echo $suj['id_sujet'];?>" class="img-fluid" alt="">
        <a class="btn_del" onclick="delFileCom(event,'<?php echo $suj['id_sujet'];?>')">
        <i class="fas fa-trash-alt del" id="trash_<?php echo $suj['id_sujet'];?>"></i></a>
     </div>
<div>
    <button type="button" name="reply" id="reply<?php echo $suj['id_sujet'];?>" form="<?php echo 
    'formrep'.$suj['id_sujet']; ?>" class="btn btn-primary btn-sm publier_com" onclick="send_com(<? 
    php echo $suj['id_sujet'];?>)">Publier</button>
</div>
</form>     
function send_com(idSuj) {
                        var formulaire = document.getElementById('formrep'+idSuj);
                        var fileInput = document.getElementById('imgFile_'+idSuj);
                        var formData = new FormData(formulaire);
                        formData.append('file', fileInput.files[0]);
                        
                        var xhr = new XMLHttpRequest();
                        xhr.open('POST', 'ajax_comment.php');
                        xhr.onload = function() {
                            if (xhr.status === 200) {
                                console.log(xhr.responseText);
                            } else {
                                console.log('Une erreur est survenue : ' + xhr.status);
                            }
                        };
                        
                        xhr.send(formData); 
                    }

Merci d'avance pour vos retours
Macintosh / Chrome 112.0.0.0


3 réponses

jordane45 Messages postés 38212 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 24 juin 2024 4 678
2 mai 2023 à 16:21

Bonjour

Une fois que tu as envoyé les données dans la base, il faut afficher le résultat dans la page

Là.. ton code n'affiche rien du tout.

Il faut donc que tu crées dans ta page un élément HTML qui va recevoir le contenu de ce que tu veux afficher


0
delaville81 Messages postés 196 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 2 juin 2024
2 mai 2023 à 16:23
<div>
                    <?php
                        $req_com = 'SELECT id_com, id_sujet, com.id_user, com.date, texte_com, img_com, tn_img_com, membre.id_membre, photo, user.id_user, user.id_membre, 
                        membre.nom, membre.nom_ep, membre.prenom
                        FROM com_test com
                        INNER JOIN user ON com.id_user = user.id_membre
                        INNER JOIN membre ON user.id_membre = membre.id_membre
                        WHERE id_sujet = '.$suj['id_sujet'].'
                        ORDER BY id_com ASC';
                        $pdo->exec('SET NAMES utf8');
                        $resu = $pdo->query($req_com);
                        while($com = $resu->fetch()){
                            $img_com_show = $com['img_com']; 
                            $tn_img_com_show = $com['tn_img_com']; 
                            $id_com = $com['id_com'];
                    ?>
                    <a id="com<?php echo $com['id_com'] ?>"></a>
                    <div class="com_show div_flex">
                        <div class="col-2 col-sm-1 col-md-1 img-user">
                            <img src="../admin/photo/<?php echo $com['photo']; ?>" class="clipClass">  
                        </div>
                        <div class="col-md-10" id="div_com<?php echo $id_com; ?>">
                            <?php if($com['nom_ep'] == ""){$nomEp = "";}else{$nomEp = $com['nom_ep'].' ';} ?>
                            <div class="text_com_name">
                                <div class="bloc_edit">
                                    <div>
                                        <span class="text_user"><?php echo $com['prenom'].' '. $com['nom'].' '.$nomEp; ?></span>
                                    </div>  
                                    <div>
                                        <?php if($com['id_membre'] == $_SESSION['id_membre']){ ?>
                                        <div id="divBtnCom<?php echo $id_com; ?>">
                                        <!---->
                                            <span class="flex_align">
                                                <a class="btn_edit" onclick="loadDivCom(event,<?php echo $id_com; ?>)">
                                                    <img src="../img/b_edit.png" id="img_edit_del<?php echo $id_com; ?>" class="img_edit_del" alt="Modifier">
                                                </a>
                                                <form id="formdelCom<?php echo $id_com; ?>" action="blog_test.php#suj<?php echo $suj['id_sujet']; ?>" method="post" enctype="multipart/form-data">
                                                    <input type="hidden" name="id_com" id="<?php echo $id_com; ?>" value="<?php echo $id_com; ?>">
                                                    <input type="submit" form="formdelCom<?php echo $id_com; ?>" class="ico_supp" name="delCom" value="" onclick="if(!confirm('Etes-vous sûr de vouloir supprimer')) return false;">      
                                                </form>
                                            </span>
                                        </div>
                                        <?php } ?>
                                    </div>  
                                </div>
                                <span class="text_com"><?php echo $com['texte_com']; ?></span>
                            </div>
                            <?php if($img_com_show != '' && $img_com_show != 'Array'){ ?>
                            <div class="img_rep">
                                <a href="blog_com/<?php echo $img_com_show; ?>" target="_blank">
                                    <?php echo '<img src="blog_com/'.$tn_img_com_show.'" class="img-fluid">'; ?>
                                </a>
                                <input type="hidden" name="inputImg" id="inputImg<?php echo $id_com; ?>" value="<?php echo $img_com_show; ?>">
                                </div>
                            <?php } ?>
                            
                        </div>

                        <div class="col-md-10 div_coment div_com_edit"  id="div_com_edit<?php echo $id_com; ?>">
                            <?php if($com['nom_ep'] == ""){$nomEp = "";}else{$nomEp = $com['nom_ep'].' ';}
                            if($img_com_show != '' && $img_com_show != 'Array'){
                                $srcEditCom = "blog_com/".$tn_img_com_show;
                            }else{
                                $srcEditCom = '#';
                            }
                            ?>
                            <form id="<?php echo "form".$id_com; ?>" name="<?php echo "form".$id_com; ?>" action="blog_test.php#com<?php echo $id_com; ?>" method="post" enctype="multipart/form-data">
                                <div>
                                    <input type="hidden" name="id_membre" id="id_membre<?php echo $id_com; ?>" value="<?php echo $_SESSION['id_membre']; ?>">
                                    <input type="hidden" name="id_com" id="<?php echo $id_com; ?>" value="<?php echo $id_com; ?>">
                                    <input type="hidden" name="nameFile" id="nameFile<?php echo $id_com; ?>" value="<?php echo $img_com_show; ?>">
                                    <span class="text_com_edit">
                                        <input type="text" class="coment" name="texte_com" value="<?php echo $com['texte_com']; ?>">
                                    </span>
                                    <a class="btn_input"><i class="far fa-image "></i><span class="name">Photos</span></a>
                                    <input type="file" class="imgCom" id="imgFileCom<?php echo $id_com; ?>" name="img_com_edit" lang="fr" accept=".jpg,.jpeg,.gif,.png" onchange="loadFileComEdit(event,<?php echo $id_com; ?>)">
                                    <div class="" id="divComEdit<?php echo $id_com; ?>"> 
                                        <a href="blog_com/<?php echo $img_com_show; ?>" target="_blank">
                                            <img src="<?php echo $srcEditCom; ?>" id="outputEdit<?php echo $id_com; ?>" class="img-fluid">
                                        </a>
                                        <input type="hidden" name="inputImage" id="inputImage<?php echo $id_com; ?>">
                                        <a class="btn_del" onclick="delFileComEdit(event,'<?php echo $id_com; ?>')"><i class="fas fa-trash-alt" id="trashEditCom<?php echo $id_com; ?>"></i></a>
                                    </div>
                                    
                                </div>
                                <div>
                                    <input type="submit" name="editCom" id="editCom<?php echo $id_com ;?>" form="<?php echo "form".$id_com ; ?>" class="btn btn-primary btn-sm publier_com" value="Publier">
                                </div>
                            </form>
                            <?php if($com['id_membre'] == $_SESSION['id_membre']){ ?>
                            <div id="divBtnCloseCom<?php echo $id_com; ?>" class="divBtnClose">
                                <span class="flex_align">
                                    <a class="btn_close" onclick="closeDivCom(event,<?php echo $id_com; ?>)">
                                        <img src="../img/b_edit.png" id="img_close_div<?php echo $id_com; ?>" class="img_edit_del" alt="Modifier">
                                    </a>
                                    <form id="formdelCom<?php echo $id_com; ?>" action="blog_test.php#suj<?php echo $suj['id_sujet']; ?>" method="post" enctype="multipart/form-data">
                                        <input type="hidden" name="id_com" id="<?php echo $id_com; ?>" value="<?php echo $id_com; ?>">
                                        <input type="submit" form="formdelCom<?php echo $id_com; ?>" class="ico_supp" name="delCom" value="" onclick="if(!confirm('Etes-vous sûr de vouloir supprimer')) return false;">      
                                    </form>
                                    </span>
                            </div>
                            <?php } ?>
                            
                        </div>
                    </div>
                    <?php } ?>
                </div>

0
delaville81 Messages postés 196 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 2 juin 2024
2 mai 2023 à 17:45
 $req_com = 'SELECT id_com, id_sujet, com.id_user, com.date, texte_com, img_com, tn_img_com, membre.id_membre, photo, user.id_user, user.id_membre, 
                        membre.nom, membre.nom_ep, membre.prenom
                        FROM com_test com
                        INNER JOIN user ON com.id_user = user.id_membre
                        INNER JOIN membre ON user.id_membre = membre.id_membre
                        WHERE id_sujet = :id_sujet
                        ORDER BY id_com ASC';

                        $data = array(':id_sujet'=>$suj['id_sujet']);
                        try{
                            $requete = $pdo->prepare($req_com);
                            $requete->execute($data);
                        
                            while($com = $requete->fetch()){
                                $img_com_show = $com['img_com']; 
                                $tn_img_com_show = $com['tn_img_com']; 
                                $id_com = $com['id_com'];
<div class="com_show div_flex">
                        <div class="col-2 col-sm-1 col-md-1 img-user">
                            <img src="../admin/photo/<?php echo $com['photo']; ?>" class="clipClass">  
                        </div>
                        <div class="col-md-10" id="div_com<?php echo $id_com; ?>">
                            <?php if($com['nom_ep'] == ""){$nomEp = "";}else{$nomEp = $com['nom_ep'].' ';} ?>
                            <div class="text_com_name">
                                <div class="bloc_edit">
                                    <div>
                                        <span class="text_user"><?php echo $com['prenom'].' '. $com['nom'].' '.$nomEp; ?></span>
                                    </div>  
                                    <div>
                                        <?php if($com['id_membre'] == $_SESSION['id_membre']){ ?>
                                        <div id="divBtnCom<?php echo $id_com; ?>">
                                            <span class="flex_align">
                                                <a class="btn_edit" onclick="loadDivCom(event,<?php echo $id_com; ?>)">
                                                    <img src="../img/b_edit.png" id="img_edit_del<?php echo $id_com; ?>" class="img_edit_del" alt="Modifier">
                                                </a>
                                                <form id="formdelCom<?php echo $id_com; ?>" action="blog_test.php#suj<?php echo $suj['id_sujet']; ?>" method="post" enctype="multipart/form-data">
                                                    <input type="hidden" name="id_com" id="<?php echo $id_com; ?>" value="<?php echo $id_com; ?>">
                                                    <input type="submit" form="formdelCom<?php echo $id_com; ?>" class="ico_supp" name="delCom" value="" onclick="if(!confirm('Etes-vous sûr de vouloir supprimer')) return false;">      
                                                </form>
                                            </span>
                                        </div>
                                        <?php } ?>
                                    </div>  
                                </div>
                                <span class="text_com"><?php echo $com['texte_com']; ?></span>
                            </div>
                            <?php if($img_com_show != '' && $img_com_show != 'Array'){ ?>
                            <div class="img_rep">
                                <a href="blog_com/<?php echo $img_com_show; ?>" target="_blank">
                                    <?php echo '<img src="blog_com/'.$tn_img_com_show.'" class="img-fluid">'; ?>
                                </a>
                                <input type="hidden" name="inputImg" id="inputImg<?php echo $id_com; ?>" value="<?php echo $img_com_show; ?>">
                                </div>
                            <?php } ?>
                        </div>

                        <div class="col-md-10 div_coment div_com_edit"  id="div_com_edit<?php echo $id_com; ?>">
                            <?php if($com['nom_ep'] == ""){$nomEp = "";}else{$nomEp = $com['nom_ep'].' ';}
                            if($img_com_show != '' && $img_com_show != 'Array'){
                                $srcEditCom = "blog_com/".$tn_img_com_show;
                            }else{
                                $srcEditCom = '#';
                            }
                            ?>
                            <form id="<?php echo "form".$id_com; ?>" name="<?php echo "form".$id_com; ?>" action="blog_test.php#com<?php echo $id_com; ?>" method="post" enctype="multipart/form-data">
                                <div>
                                    <input type="hidden" name="id_membre" id="id_membre<?php echo $id_com; ?>" value="<?php echo $_SESSION['id_membre']; ?>">
                                    <input type="hidden" name="id_com" id="<?php echo $id_com; ?>" value="<?php echo $id_com; ?>">
                                    <input type="hidden" name="nameFile" id="nameFile<?php echo $id_com; ?>" value="<?php echo $img_com_show; ?>">
                                    <span class="text_com_edit">
                                        <input type="text" class="coment" name="texte_com" value="<?php echo $com['texte_com']; ?>">
                                    </span>
                                    <a class="btn_input"><i class="far fa-image "></i><span class="name">Photos</span></a>
                                    <input type="file" class="imgCom" id="imgFileCom<?php echo $id_com; ?>" name="img_com_edit" lang="fr" accept=".jpg,.jpeg,.gif,.png" onchange="loadFileComEdit(event,<?php echo $id_com; ?>)">
                                    <div class="" id="divComEdit<?php echo $id_com; ?>"> 
                                        <a href="blog_com/<?php echo $img_com_show; ?>" target="_blank">
                                            <img src="<?php echo $srcEditCom; ?>" id="outputEdit<?php echo $id_com; ?>" class="img-fluid">
                                        </a>
                                        <input type="hidden" name="inputImage" id="inputImage<?php echo $id_com; ?>">
                                        <a class="btn_del" onclick="delFileComEdit(event,'<?php echo $id_com; ?>')"><i class="fas fa-trash-alt" id="trashEditCom<?php echo $id_com; ?>"></i></a>
                                    </div>
                                    
                                </div>
                                <div>
                                    <input type="submit" name="editCom" id="editCom<?php echo $id_com ;?>" form="<?php echo "form".$id_com ; ?>" class="btn btn-primary btn-sm publier_com" value="Publier">
                                </div>
                            </form>
                            <?php if($com['id_membre'] == $_SESSION['id_membre']){ ?>
                            <div id="divBtnCloseCom<?php echo $id_com; ?>" class="divBtnClose">
                                <span class="flex_align">
                                    <a class="btn_close" onclick="closeDivCom(event,<?php echo $id_com; ?>)">
                                        <img src="../img/b_edit.png" id="img_close_div<?php echo $id_com; ?>" class="img_edit_del" alt="Modifier">
                                    </a>
                                    <form id="formdelCom<?php echo $id_com; ?>" action="blog_test.php#suj<?php echo $suj['id_sujet']; ?>" method="post" enctype="multipart/form-data">
                                        <input type="hidden" name="id_com" id="<?php echo $id_com; ?>" value="<?php echo $id_com; ?>">
                                        <input type="submit" form="formdelCom<?php echo $id_com; ?>" class="ico_supp" name="delCom" value="" onclick="if(!confirm('Etes-vous sûr de vouloir supprimer')) return false;">      
                                    </form>
                                    </span>
                            </div>
                            <?php } ?>
                        </div>
                    </div>
 }catch(Exception $e){
                        echo " Erreur ! ".$e->getMessage();
                        echo " Les datas : " ;
                        print_r($data);
                    }     	

-1