Ma fontion ne renvoie rien [Résolu]

Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
- - Dernière réponse : RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
- 31 déc. 2014 à 16:47
Bonjour,
J'ai commencé le Javascript et je m'attaque à la méthode AJAX, mais j'ai un problème avec "$.post" : elle ne me renvoie rien. Mon code est celui-ci :

$(document).ready(function(){
     
    $("#form form").submit(function(){
        var action      = $(this).attr('action');
        var nom         = $('#nom').val();
         
 
        $(".messages").slideUp('800', function(){
 
             
            $.post(  action, {
                nom         : nom
 
            }, function(data){
                $alert('OOO');
                $(".messages").html(data);
                $(".messages").slideDown('slow');
                 
            });
        });
         
         
        return false;
    });
     
     
});


Et mon code HTML :
<html>
 <head>
 <title>TestCCM</title>
 <link rel="stylesheet" type="text/css" href="test.css">
 </head>
 
          <body>
<div id="form">
 
    <div class="messages">
         
     
    </div>
     
    <form action="inscription_2.php" method="post">
     
    <p>
        <label for="nom">Nom</label>
        <input type="text" name="nom" id="nom">
    </p>
     
    <p>
        <input type="submit" value="Envoyer">
    </p>
    </form>
 
</div>
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
                <script src="inscription_2.js"></script>
          </body>         
</html>




Un message devrait apparaître (d'une page php que j'ai créé) comme dans ce tutoriel

https://www.youtube.com/watch?v=vYXTt2lKCV8#t=588 mais rien ne se passe.

Si quelqu'un peu me dire où est l'erreur. Merci.
Afficher la suite 

Votre réponse

8 réponses

Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
0
Merci
Bonjour,

Perso.. pour l'AJAX je préfère la syntaxe suivante :

(document).ready(function(){
     
  $("#form form").submit(function(){
     var action      = $(this).attr('action');
     var nom         = $('#nom').val();
     $(".messages").slideUp('800', function(){
       $.ajax({
            url : action ,
            data : "?nom="+nom,
            type : 'POST',
            dataType : 'html',
            success : function(reponse){ 
                   alert(reponse);
            },
            error : function(resultat, statut, erreur){
              alert(erreur + " - " + resultat);
            }
      });
  });         
});


Ensuite....
Si tu ne l'as pas déjà fait .. installe le plugin FireBug ( pour FireFox), lance le .. et regarde ce qu'il t'affiche dans la console lorsque tu valides ton formulaire....
Cela pourra te permettre de trouver d'où vient le PB ( erreur de syntaxe dans ton script.. ou mauvaises variables passées...)



Commenter la réponse de jordane45
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
0
Merci
Salut,
Merci pour la réponse, ton code fonctionne mais FireBug ne me dit pas qu'il y a une erreur pour le mien... Je vais travailler avec le tien.
Commenter la réponse de RateauMix
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
0
Merci
Que t'affiche la console ?
Tu devrais voir apparaitre une ligne de ce genre :



Si tu la déplies (en cliquant sur le + ) :


Tu verras ce que donnes les paramètres ...
Et tu peux aller dans l'onglet "Réponse" ou "Html" pour savoir ce qu'elle a retourné.



Mais bon.. si mon code ne t'affiche rien du tout.. même pas les alert d'erreur.. c'est que ton script ne se déclenche pas....

Ajoute des ALERT dans ton code pour savoir si on rentre bien dedans :
Par exemple :

(document).ready(function(){
     
  $("#form form").submit(function(){
   alert("Submit du formulaire !");
     var action      = $(this).attr('action');
     var nom         = $('#nom').val();
     $(".messages").slideUp('800', function(){
       alert("slideUp fini");
       $.ajax({
            url : action ,
            data : "?nom="+nom,
            type : 'POST',
            dataType : 'html',
            success : function(reponse){ 
                   alert(reponse);
            },
            error : function(resultat, statut, erreur){
              alert(erreur + " - " + resultat);
            }
      });
  });         
});


Si tu n'as toujours pas d'alert .. c'est que ça vient de la méthode d'appel de ta fonction.
Perso.. je ne fais JAMAIS de javascript sur un SUBMIT !
(le submit..étant l'envoie en PHP de ton formulaire.. pas sûr qu'il déclenche l' event javascript !)

A la limite.. remplaces ton bouton submit..
  <input type="submit" value="Envoyer">

par un bouton normal
  <input type="button" id="valider" value="Envoyer">


Et modifie l'appel à ta fonction par :
  $("#valider").click(function(){





Commenter la réponse de jordane45
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
0
Merci
La console ne m'affiche rien du tout du tout,
quand j'utilise ton code, il m'affiche une partie du contenu de mon php (qui est
<?php 
	echo "<div class=\"error\">Veuillez remplir le formulaire</div>";
?>
) , il m'affiche : Veuillez remplir le formulaire"; ?>
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
Je viens d'ajouter les "alert()" et ils fonctionnent tous
jordane45
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
-
Même le "réponse" ??
Donc c'est tout bon alors.....

donc si cette ligne
$(".messages").html(reponse);
ne fonctionne pas.. c'est que tu as un souci dans ton script PHP et non plus dans ton javascript...
Fais voir le code te ta page PHP
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
Mon PHP est juste
<?php 
	echo "<div class=\"error\">Veuillez remplir le formulaire</div>";
?>
jordane45
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
-
Je ne comprend pas...
Ton code fonctionne non ?
Il t'affiche quoi dans ta div messages ??

Et dans fireBug.. tu as quoi ?
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
dans ma div message j'ai, d'après FireBug :
<div class="messages" style="display: block;">Veuillez remplir le formulaire"; ?></div>
Commenter la réponse de RateauMix
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
0
Merci
Tu as un "?>" en trop visiblement...
N'en aurais tu pas mis deux dans ton fichier PHP ??
Supprimes tout son contenu ( via un CTRL+A puis SUPPR ) puis recolle juste ton code :
<?php 

  echo "<div class=\"error\">Veuillez remplir le formulaire</div>";

?>


Et pour FireBug.. regarde ce que dit la CONSOLE...( tu sais... les captures écran que je t'ai mis tout à l'heure.....)
Pour la faire afficher .. clique sur l'icone en haut à droite du navigateur :

Commenter la réponse de jordane45
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
0
Merci
J'ai copié-collé et rien de nouveau. Voilà ca que m'affiche la console :
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
Pour le PHP peut être qu'il s'agit du fait que je n'ai pas WAMPP ?
jordane45
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
-
bizarre....

Essayes ça ( remplace tout ton fichier html)


   <div id="form"> 
    <div class="messages">     
    </div>
    
    <form action="inscription_2.php">
    <p>
        <label for="nom">Nom</label>
        <input type="text" name="nom" id="nom">
    </p>    
    <p>
      <input type="button" id="valider" value="Envoyer">
    </p>
    </form>

<script type="text/javascript">
$(document).ready(function(){
	console.log ("************ Document READY ************");
	$("#valider").click(function(){
           console.log("J'ai cliqué sur le bouton !");
		var action = $("#form form").attr('action');
		var nom 	= $('#nom').val();

		$(".messages").slideUp('800', function(){
			console.log("slideup terminé !");
			$('#valider').hide().after('<img src="chargement.gif" class = "chargement">');
			
		       $.ajax({
		            url : action ,
		            data : "?nom="+nom,
		            type : 'POST',
		            dataType : 'html',
		            success : function(reponse){ 
                               console.log ("reponse");
		            	$(".messages").html(reponse);
				$(".messages").slideDown('slow');
				$(".chargement").fadeOut();
				$('#valider').fadeIn();
		            },
		            error : function(resultat, statut, erreur){
		              alert(erreur + " - " + resultat);
		            }
		      }); // Fin AJAX
		 }); // Fin SlideUp         
	}); // Fin  click	
// Fin document ready	
});
</script>



Cette fois.. tu devrais avoir des choses dans ta console FireBug....
Sinon.. je ne vois pas.... et il faudra alors que tu me donnes TOUT le code de ta page HTML (ta première page..avec l'import de jquery....)
Commenter la réponse de RateauMix
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
0
Merci
Regardes aussi quelles options sont activées dans ton fireBug.
Il te faut au minimum celles là :


Commenter la réponse de jordane45
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
0
Merci
Là je viens de tout activer et j'ai
jordane45
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
> RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
il n'y a que les ROUGES qui comptent vraiment (comme erreurs...)
Donc .. coche uniquement les même options que moi..
regarde ce que ça donne..
Si tu as encore des erreurs ( lignes rouge..) corrige les...
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
Ok, je vais faire ça.
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
Il ne me met que : "aucun élément trouvé ?> ---> inscription_2.php (ligne 4, col. 3)"
jordane45
Messages postés
23628
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 décembre 2018
-
Il te marque ça où ?
RateauMix
Messages postés
74
Date d'inscription
dimanche 30 novembre 2014
Dernière intervention
29 novembre 2017
-
Ok, j'ai trouvé ! Il fallait télécharger WAMPP et ouvrir les fichiers avec... Désolé d'avoir été aussi long :/ Mais merci beaucoup ! :D
Commenter la réponse de RateauMix

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.