11521 sujets

JavaScript, DOM et API Web HTML5

Rester sur la page lors de l'exécution d'une requête POST JQuery

Bonjour,
J'ai une fonction PHP qui fait de l'insertion en base de données. Voici un extrait du code PHP qui me renvoie correctement la valeur attendue :
if ($result){
  echo "Success";
}


Le résultat de l'insertion (correctement effectuée) est que j'arrive naturellement sur une page blanche avec un simple Success.

En partant de ce code JS, comment afficher un message de confirmation de type alert alert-success si l'action est correctement effectuée ? Mon code ne me renvoie aucune erreur je ne sais pas pourquoi.

<script type="text/javascript">
    $(document).ready(function() {
        $("#insertionBDD").click(function(e) {
					if (!validateForm()) {
						e.preventDefault();
					}
						$.post(
                'insertion.php', // Un script PHP que l'on va créer juste après
                {
                    nom_client: $("#UnChamp").val()
                },

                function(data) {
                    if (data == 'Success') {
$("#resultat").html('Insertion OK!');
												$("#resultat").addClass("alert alert-success").fadeTo(3000, 0);
                    } else {
                        $("#resultat").html('Les champs ne sont pas correctement remplis !');
												$("#resultat").addClass("alert alert-danger").fadeTo(3000, 0);
                    }

                },
                'text'
            );
        });
    });
</script>

Modifié par chritopherr (15 Mar 2020 - 16:29)
stryk a écrit :
Pour ce que tu veux faire tu dois faire un ajax.
Désolé je suis dans un bus ça va être compliqué de te faire un exemple.
Sinon j'ai trouvé ceci, tu vas devoir adapter ton code et le php aussi:
https://forum.alsacreations.com/topic-5-81758-1-Variable-ajax-Javascript-vers-PHP.html


Hello,
merci pour ta réponse. J'avais déjà essayé. Voici le code que j'ai écrit :
<script type="text/javascript">
    $(document).ready(function() {
        $("#insertionBDD").click(function(e) {
					if (!validateForm()) {
						e.preventDefault();
					}
					$.ajax({
						url:"/insertion.php ",
						method:"POST", //First change type to method here

						data:{
							nom_client: $("#UnChamp").val()
						},
						success:function(response) {
							$("#resultat").html('OK !');
							$("#resultat").addClass("alert alert-success").fadeTo(3000, 0);
						},
						error:function(){
							$("#resultat").html('Les champs ne sont pas correctement remplis !');
							$("#resultat").addClass("alert alert-danger").fadeTo(3000, 0);
						}

					});
        });
    });
</script>
Teste ce code pour savoir si ton PHP te renvoi quelque chose !!


document.addEventListener('DOMContentLoaded', function () { getInsert(); });

var getInsert = async function () {

	var ResponseData = await fetch('./insertion.php');
	alert(ResponseData);
	var ResponseJson = await ResponseData.json();
	alert(ResponseJson);

};
Ah ok ok.
Donc normalement avec un console.log a la place d'un alert tu devrait avoir quelque chose de plus parlant.
Sujet clos
Aller à