Discussion :

[facilus68]

Bonjour,

J'ai crée un formulaire de contact dont je le charge dans un div comme suit :

contact.php :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
<div id="content">
		<div class="post">
						<h1 class="title">Nous contacter</h1>
 
						<div class="entry">
 
							<div id='form_wrap'>
 
								<form method="post" name="contactForm" id="contactForm">
									<p>Votre message</p>
									<label for="sujet">Sujet: </label>
									<input type="text" name="sujet" value="" id="sujet" />
									<label for="message">Message : </label>
									<textarea  name="message" value="Votre Message" id="message" ></textarea>
									<p></p>	
									<label for="name">Nom: </label>
									<input type="text" name="name" value="" id="name" />
									<label for="email">Email: </label>
									<input type="text" name="email" value="" id="email" />
									<input type="submit" name ="envoyer" id ="envoyer" value="Envoyer" />
								</form>
							</div>
						</div>	
			</div>
</div>

chargement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
$("#contact").click(function() {
			$('#content').load('Contacts/contact.php #content');
});

Âpres j’essaye de lancer un script PHP apres clic sur le button en utilisant JQuery et Ajax mais c'est la le problème, après avoir déboguée je trouve que le script n'est pas du tout lancer. Voici le code du script ajax et php :

scripts.js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
 
$("#envoyer").click( function() {
	$.ajax({
	   url: 'hello.php',
	   success: function (response) {//response is value returned from      for your example it's "the subject is : youtsubject"
		 alert(response);
	   }
	   })
	});

hello.php :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<?php
    echo "Your subject is : "+$_POST['sujet'];
?>

Je sais pas pourquoi le script ne s'execute pas.

Merci de votre aide

[Darkaurora]

Bon alors premièrement je pense que tu confonds l'ajax et la soumission de formulaire, bien que cela soit sensiblement semblable il y a une distinction.

Ton php à besoin d'une variable $_POST pour pouvoir correctement fonctionner, sinon il génère une erreur et ne s'exécuteras pas.

Or dans ton ajax tu n'envoie aucune donnée à ton script php.

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
$("#envoyer").click( function() {
	$.ajax({
		type: 'POST', // On spécifie la méthode
		url: 'hello.php',
		data: { 'sujet': ton_sujet }, // 'sujet' est la clé accéssible dans ta variable $_POST, donc dans ton script php ==> $_POST['sujet'] et contiendra la valeur de ta variable 'ton_sujet' javascript
		success: function (response) {
			alert(response);
			console.log(response); // Conseille d'amis utilise les consoles Firebug ou la console de developpement de ton navigateur ( F12 ) pour mieux comprendre tes erreurs :)
			}
		} )
} );

[facilus68]

Merci "Darkaurora",

J'ai fais les changements comme suit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
$("#envoyer").click( function() {
	$.ajax({
		type: 'POST',
	        url: 'Contacts/hello.php',
	        data: { 'sujet': $("#sujet").val() },
	        success: function (response) {
		   alert(response);
		   console.log(response); 
	   }
	   })
	});

La page php ne s'est pas affichée

Pour la console de firebug rien n'est affichéeapres clic sur le bouton

Bon alors premièrement je pense que tu confonds l'ajax et la soumission de formulaire, bien que cela soit sensiblement semblable il y a une distinction.

Ton php à besoin d'une variable $_POST pour pouvoir correctement fonctionner, sinon il génère une erreur et ne s'exécuteras pas.

Or dans ton ajax tu n'envoie aucune donnée à ton script php.

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
$("#envoyer").click( function() {
	$.ajax({
		type: 'POST', // On spécifie la méthode
		url: 'hello.php',
		data: { 'sujet': ton_sujet }, // 'sujet' est la clé accéssible dans ta variable $_POST, donc dans ton script php ==> $_POST['sujet'] et contiendra la valeur de ta variable 'ton_sujet' javascript
		success: function (response) {
			alert(response);
			console.log(response); // Conseille d'amis utilise les consoles Firebug ou la console de developpement de ton navigateur ( F12 ) pour mieux comprendre tes erreurs :)
			}
		} )
} );

[Darkaurora]

Concrètement ta page php ne s'affichera pas tu ne récupéreras uniquement les données.

Si tu pouvais vérifier simplement que tu appelles bien ton script php via firebug console web, réseau et si tu passe bien les données.

PS: j'utilise chrome et sa console de développement et firebug je connais que très peu

[facilus68]

J'ai esseyé avec chrome maius comme je suis débutant,j'ai pas trouvé comment vérifié l'appel du script avec le passage des données

J'ai remarquée ceci aussi :

Quand je fait le "load" , aucun n'evement n'est appelé pour les scripts. J'ai mis des breaks point, ils sont executer seulement au 1er chargement de la page mais apres le "load" non.

Concrètement ta page php ne s'affichera pas tu ne récupéreras uniquement les données.

Si tu pouvais vérifier simplement que tu appelles bien ton script php via firebug console web, réseau et si tu passe bien les données.

PS: j'utilise chrome et sa console de développement et firebug je connais que très peu

[Darkaurora]

sous chrome il suffit de faire F12 et dans l'onglet network tu as un tableau avec l'ensemble des appels vers les différentes pages. A ouvrir avant d'effectuer ton click.
Question peut être stupide mais as tu bien intégrer la librairie jquery?

[facilus68]

Oui j'ai bien intégré jquery, j'ai fait plusieurs tests.

Sur la console "Network" je vois seulement la page html dans "response" avant clic bouton "envoyer", apres click bouton , y'a d'autres elements qui apparaissent mais pas script.

Es ce que le "load" pour charger le div n'est pas la cause du probleme ?

sous chrome il suffit de faire F12 et dans l'onglet network tu as un tableau avec l'ensemble des appels vers les différentes pages. A ouvrir avant d'effectuer ton click.
Question peut être stupide mais as tu bien intégrer la librairie jquery?

[Darkaurora]

Il faut m'envoyer le reste de ton code parce que sincèrement c'est étrange et le bout de code que tu m'as envoyé fonctionne correctement pour moi.

[facilus68]

Je te l'ai envoyé en MP

Il faut m'envoyer le reste de ton code parce que sincèrement c'est étrange et le bout de code que tu m'as envoyé fonctionne correctement pour moi.

[Darkaurora]

Je ne le savais pas je l'avoue, il s'agit d'un submit et l'événement 'click' ne fonctionne pas dessus. Si tu remplace par type="button" alors la pas de problème.

PS: Attention l'id de ce submit ne correspond pas au sélecteur jquery.

[facilus68]

J'ai changer le script est sa marche , mais j'ai une erreur je ne sais pas pourquoi !!!

voici le script :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
$("#contactForm").submit( function() {	// à la soumission du formulaire						 
		$.ajax({ // fonction permettant de faire de l'ajax
		   type: "POST", // methode de transmission des données au fichier php
		   url: "actionContact.php", // url du fichier php
		   data: "sujet="+$("#sujet").val(), // données à transmettre
		   success: function(msg){ // si l'appel a bien fonctionné
				if(msg==1) // si la connexion en php a fonctionnée
				{
					$("div#form_wrap").html("<span id=\"confirmMsg\">Vous &ecirc;tes maintenant connect&eacute;.</span>");
					// on désactive l'affichage du formulaire et on affiche un message de bienvenue à la place
				}
				else // si la connexion en php n'a pas fonctionnée
				{
				alert('erreurs');
					$("div#form_wrap").html("Erreur lors de la connexion, veuillez v&eacute;rifier votre login et votre mot de passe.");
					// on affiche un message d'erreur dans le span prévu à cet effet
				}
		   }
		});
		return false; // permet de rester sur la même page à la soumission du formulaire
	});

c'est le "else" qui est exécuté et pourtant le script c'est exécuté