Forum d'entraide PHPFrance

Bonjour à tous,

Je viens faire appel à vous car je n'ai pas de grandes connaissances en JS/PHP.

Mon problème : On m'a conseillé de mettre à jour une partie de mon code :

Cette partie :

$.ajax({
    url: "add_comment.php",
    method: "POST",
    data: form_data,
    dataType: "JSON",
    success: function(data) {
        if (data.error !== '<label class="validation">Ton message a bien été envoyé !</label>') {
            $comment_message.html(data.error);
            $comment_form[0].comment_id.value = "0";
            load_comment();
        }
        if (data.error !== '<label class="validation">OOPS ! Ton message ne veut pas partir.. Réessaie !</label>') {
            $comment_content.val(""); //ici je vide seulement le texte saisi après validation
            $comment_message.html(data.error);
            $comment_form[0].comment_id.value = "0";

        }
    },
    error: function(data) {
        if (data.error !== "") {
            $comment_message.html(data.error);
            $comment_form[0].comment_id.value = "0";

        }
    },
});

Et on m'a dit de la remplacer par ceci :

done: function(data) {
        if (data.status == "OK") {
            $comment_message.html(data.message);
            $comment_form[0].comment_id.value = "0";
            load_comment();
        } else {
            $comment_content.val("");
            $comment_message.html(data.message);
            $comment_form[0].comment_id.value = "0";
        }

Et en mettant à jour ma page php par ceci :

if (cBon ) {
  $retour["status"] = "OK";
  $retour["message"] = "Ton message a bien été envoyé !";
}
else {
  $retour["status"] = "N0K";
  $retour["message"] = "OOPS ! Ton message ne veut pas partir.. Réessaie !";
}
echo json_encode($retour);

J'ai passé des heures à essayer d'intégrer ce code de différentes manières mais je dois mal faire les choses car un coup mes messages ne s'envoient plus, un coup je n'ai plus le message de validation.. J'ai fini par tout remettre comme c'était et venir chercher de l'aide.

Si quelqu'un voudrait bien me montrer comment intégrer mon nouveau code, ça me retirerai une grosse épine du pied..

Ma page php au complet :

<?php
//add_comment.php
$connect = new PDO('***');

$error = '';
$comment_name = '';
$comment_content = '';
$email = '';
$date = new \DateTime($row["date"]);
$formatedDate = (new IntlDateFormatter('fr_FR', IntlDateFormatter::LONG, IntlDateFormatter::SHORT));

// DEBUT RECAPTCHA
// On vérifie si le champ "recaptcha-response" contient une valeur
if (empty($_POST['recaptcha-response']))
{
    header('Location: index.html');
    die();
}
else
{

    // On prépare l'URL
    $url = "https://www.google.com/recaptcha/api/siteverify?secret=***&response={$_POST['recaptcha-response']}";

    // On vérifie si curl est installé
    if (function_exists('curl_version'))
    {
        $curl = curl_init($url);
        curl_setopt($curl, CURLOPT_HEADER, false);
        curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($curl, CURLOPT_TIMEOUT, 1);
        curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
        $response = curl_exec($curl);
    }
    else
    {
        // On utilisera file_get_contents
        $response = file_get_contents($url);
    }
    // On vérifie qu'on a une réponse
    if (empty($response) || is_null($response))
    {
        header('Location: index.html');
        die();
    }
    else
    {
        $data = json_decode($response);
        if ($data->score >= 0.5)
        {
            // je réalise mon action de formulaire.
            if (empty($_POST["comment_name"]))
            {
                $error .= '<p class="text-danger"></p>';
            }
            else
            {
                $comment_name = $_POST["comment_name"];
            }

            if (empty($_POST["comment_content"]))
            {
                $error .= '<p class="text-danger"></p>';
            }
            else
            {
                $comment_content = $_POST["comment_content"];
            }

            if (empty($_POST["email"]))
            {
                $error .= '<p class="text-danger"></p>';
            }
            else
            {
                $email = $_POST["email"];
            }

            if ($error == '')
            {
                $query = "
 INSERT INTO tbl_comment
 (parent_comment_id, comment, comment_sender_name, email)
 VALUES (:parent_comment_id, :comment, :comment_sender_name, :email)
 ";
                $statement = $connect->prepare($query);
                $statement->execute(array(
                    ':parent_comment_id' => $_POST["comment_id"],
                    ':comment' => $comment_content,
                    ':comment_sender_name' => $comment_name,
                    ':email' => $_POST["email"]
                ));
                $error = '<label class="validation">Ton message a bien été envoyé !</label>';
            }

            else
            {
                header('Location: index.html');
                die();
            }
        }
        else
        {
            $error = '<label class="validation">OOPS ! Ton message ne veut pas partir.. Réessaie !</label>'; // tu es potentiellement un robot.
            
        }
    }
}
// FIN RECAPTCHA


$data = array(
    'error' => $error
);

echo json_encode($data);

?>

Ma page JS au complet :

//Connexion Recaptcha
grecaptcha.ready(function() {
    grecaptcha
        .execute("***", {
            action: "homepage",
        })
        .then(function(token) {
            document.getElementById("recaptchaResponse-com").value = token;
        });
});

$(document).ready(function() {

    const $comment_form = $("#comment_form");
    const $comment_content = $("#comment_content");
    const $comment_message = $("#comment_message");
    const $display_comment = $("#display_comment");
    $comment_form.on("submit", function(event) {
        event.preventDefault();
        const form_data = $comment_form.serialize();
        $.ajax({
            url: "add_comment.php",
            method: "POST",
            data: form_data,
            dataType: "JSON",
            success: function(data) {
                if (data.error !== '<label class="validation">Ton message a bien été envoyé !</label>') {
                    $comment_message.html(data.error);
                    $comment_form[0].comment_id.value = "0";
                    load_comment();
                }
                if (data.error !== '<label class="validation">OOPS ! Ton message ne veut pas partir.. Réessaie !</label>') {
                    $comment_content.val(""); //ici je vide seulement le texte saisi après validation
                    $comment_message.html(data.error);
                    $comment_form[0].comment_id.value = "0";

                }
            },
            error: function(data) {
                if (data.error !== "") {
                    $comment_message.html(data.error);
                    $comment_form[0].comment_id.value = "0";

                }
            },
        });
        //on renouvelle le token pour envoyer un 2nd commentaire
        // Clef REcaptcha site ci dessous
        grecaptcha
            .execute("***", {
                action: "homepage",
            })
            .then(function(token) {
                document.getElementById("recaptchaResponse-com").value = token;
            });
    });
    reload();
    //////////////////////////////////
    function load_comment() {
        $.ajax({
            url: "fetch_comment.php",
            //POST pour envoyer des données, et GET pour obtenir des données
            method: "POST",
            success: function(data) {
                $display_comment.html(data);
                $(".reply").on("click", function() {
                    $comment_form[0].comment_id.value = $(this).attr("id");
                    $comment_form[0].comment_name.focus();
                });
            },
        });
    }

    function reload() {
        load_comment();
        setTimeout(reload, 10000);
    }
});

PS: dsl l'indentation du code n'a pas voulu fonctionner en envoyant le message

Salutations !

L'idée est effectivement que ton code php ne renvoi pas du code html, mais juste un code de succès (OK ou NOK) et éventuellement un message.

Par rapport à ce qu'on te recommande, il n'y aurait donc presque rien à changer dans ton code php (en supposant qu'il fonctionne comme tu le souhaites), si ce n'est remplacer les lignes :

$error = '<label class="validation">Ton message a bien été envoyé !</label>';

par

$retour["status"] = "OK";
$retour["message"] = "Ton message a bien été envoyé !";

Et

$error = '<label class="validation">OOPS ! Ton message ne veut pas partir.. Réessaie !</label>'; 

par

$retour["status"] = "N0K";
$retour["message"] = "OOPS ! Ton message ne veut pas partir.. Réessaie !";

Et à la fin du code

$data = array(
    'error' => $error
);
echo json_encode($data);

par

echo json_encode($retour);

Il faut alors ensuite adapter le traitement javascript au nouvelles valeurs qui lui sont envoyées (au lieu de data.error, tu auras data.status et data.message)