Comment stopper l'exécution de script ajax

[di6zero]

bonjour, j'ai déjà poser cette question mais pas de réponse, après plusieurs recherche je pas de solution alors je doit recommencer avec un autre titre.

j'ai un système de commentaire, que je traite avec ajax pour ne pas actualiser le navigateur, ça marche mais le problème c'est quand je click sur le bouton commenter au lieux d'enregistrer un seul commentaire, le script s’exécute plusieurs fois et enregistre le même commentaires 5,7,100 fois

j'aimerais que si je click sur commenter, qu'il y ai qu'un seul enregistrement, que le script transmet a la page comment_add.php qu'un seul commentaire par click

voici mon code:

comment.php

<form class="form_com">
    <textarea id="com_comment_<?= $bar_cmt;?>" class="com_comment" placeholder="votre commentaire"></textarea>
    <input type="hidden" id="comment_id_<?= $bar_cmt;?>" value="0"/>
    <input type="hidden" id="bar_cmt_<?= $bar_cmt;?>" value="<?= $bar_cmt;?>" />
    <button type="submit" class="comment_sub" id="comment_sub_<?= $bar_cmt;?>">Commenter</button>
</form>

<script>
    $(document).ready(function(){
        $(document).on('click', '#comment_sub_'+<?= $bar_cmt;?>, function(cmm){
            cmm.preventDefault();
            var com_comment = $('#com_comment_'+<?= $bar_cmt;?>).val();
            var comment_id = $('#comment_id_'+<?= $bar_cmt;?>).val();
            var bar_cmt = $('#bar_cmt_'+<?= $bar_cmt;?>).val();
            $.ajax({
                url : "comment/comment_add.php",
                method : "POST",
                data : {com_comment:com_comment, comment_id:comment_id, bar_cmt:bar_cmt},
                dataType: "json",             
                success:function(data)
                {
                    if(data.error != '')
                    {
                        $('#pub_message').html(data.error);
                        $('.comment_id').val('0');
                    }
                    else{
                        $('#pub_message').html(data.error);
                    }
                }
            });
        });
    });
</script>

comment_add.php

require_once'../inc/functions.php';
if (session_status() == PHP_SESSION_NONE) {
session_start();
}
require_once'../identifiant.php';
$id_user = $_SESSION['auth']->id_user;
$prenom_user = $_SESSION['auth']->prenom_user;
$nom_user = $_SESSION['auth']->nom_user;
$avatar_user = $_SESSION['auth']->avatar_user;
if (!empty($_POST['com_comment'])) {
$com_comment = $_POST['com_comment'];
$quer = "INSERT INTO commentaire (id_com_parent, id_pub_com, id_user_com, prenom_user_com, nom_user_com, avatar_user_com, commentaire_com, date_time_com) VALUES (?, ?, ?, ?, ?, ?, ?, NOW())";
$statement = $pdo->prepare($quer);
$statement->execute([$_POST['comment_id'], $_POST['bar_cmt'], $id_user, $prenom_user, $nom_user, $avatar_user, $com_comment]);
}
$data = array('error' =>$error);
echo json_encode($data);

merci beaucoup d'avance

 

[rick38]

Si ça correspond au nombre de fois que la souris a cliqué, le plus simple est de désactiver le bouton (attribut css disabled) avant l'appel ajax (et de le réactiver au success de l'ajax, en vidant le textarea si pas d'erreur).

 

[di6zero]

bonjour rick38 merci beaucoup pour ta réponse mais si je le désactive en css e que je l'active en success, ca fonctionnera pas parce que le bouton sera désactiver avant l’appel ajax. du coup quand le bouton est désactiver avant ajax il y aura pas de success

 

[rick38]

Ca n'a rien à voir. L'évènement est déclenché au click sur le bouton, à partir de là plus besoin du bouton il peut être rendu non cliquable.