[AJAX] envoyer une donnée avec jquery et recevoir avec php

**4uatre** · 25/12/2011, 10h52

Bonojur;

je suis nouveau dans ce forum, et dans la programmation javascript (bib jquery)
commançant dans le vif du sujet :

je souaite faire un petit menu qui va me permettre de basculer entre 4 langues pour un siteweb culturel bref, voici mon code :

html :

Code :

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

1
2
3
4
<a id="lang_fr" href="#"  >fr</a>
 <a id="lang_en" href="#"  >en</a>
 <a id="lang_de" href="#"  >de</a>
<a id="lang_es" href="#"  >es</a>

jquery :

Code :

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

1
2
3
4
5
6
7
8
$(document).ready(function() {
        var l="" ;
		$("a").click(function (){ 
			l = $(this).html(); 
			alert(l);
			$.post("jquery.php", {name: l});
		});
});

php :

Code :

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

1
2
3
4
5
$lang="";
if (isset($_POST['name'])){
$lang=$_POST['name'];
echo $lang ;
}

l'alert m'affiche bien à chaque foi : fr, de, en ou es.
mais la methode $.post n'envoi rien et je suis bloqué

.
peut étre mon raisonnement est faux je sais pas

, j'ai googlé ici et la
mais la plus part des solutions présents POST étaient pour un formulaire html avec la balise form ect ... mais moi je veux pas utiliser un formulaire.
je peut faire comme ça :

Code :

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

<a id="lang_fr" href="monfichier.php?lang=fr"  >fr</a>

ensuite extraire le contenu du variable lang de l'URL seulement avec php sans jquery, cependant je veux que le passage soit transparent et sans passage de paramètres dans l'URL.

**Rachel** · 25/12/2011, 17h30

bonjour

tu peux utiliser ceci :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
$(document).ready(function() {
        var l="" ;
		$("a").click(function (){ 
			l = $(this).html(); 
			alert(l);
			$.ajax({
  url: "jquery.php",
  type:"POST",
  data:{name,l},
  success: function(msg){  $("#id").html( msg );}
                       });
		});
        });

remplace #id par l'identifiant de l'élément que tu veux changer

**4uatre** · 25/12/2011, 20h57

bonsoir,

j'ai utilisé ton code rotrevrep et j'ai passé l'id comme tu ma indiqué mais ça n'a pas marché :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$(document).ready(function() {
        var l="" ;
	var id_="";
		$("a").click(function (){ 
			l = $(this).html(); 
			id_=$(this).attr('id');
			$.ajax({
  url: "jquery.php",
  type:"POST",
  data:{name,l},
  success: function(msg){  $(id_).html( msg );}
                       });
		});
});

avez vous testez le code ?

**Bovino** · 27/12/2011, 11h23

Ton premier code était suffisant, le seul problème n'est pas

mais la methode $.post n'envoi rien

mais le fait que tu ne fais rien du résultat retourné par PHP.
$.post() prend un 3e paramètre qui est une fonction de rappel permettant de traiter le résultat reçu :

Code :

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

$.post("jquery.php", {name: l}, function(reponse){alert(reponse);});

**4uatre** · 28/12/2011, 07h29

bonsoir,

merci pour la correction du code, mais coté php il n'affiche pas toujours le résultat du post récupéré. j'ai modifié le code php pour vérifier voici tout le code :

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
<?php
if (empty($_POST['name'])) {
        $return['error'] = true;
        $return['msg'] = 'You did not enter you language.';
}
else {
        $return['error'] = false;
        $return['msg'] = 'You\'ve entered: ' . $_POST['name'] . '.';
}
 
echo json_encode($return);
?>
<!DOCTYPE html>
<html>
<head>
<title>Post</title>
<script type="text/javascript" src="jquery1.7.js"></script>
<script language="javascript" type="text/javascript">
var l="" ;
var id_="";
$(document).ready(function() {    
		$("a").click(function (){ 
			l = $(this).html(); 
			id_=$(this).attr('id');
			$.post("jquery.php", {name: l}, function(reponse){alert(reponse);});
		});
});
</script>
</head>
<body>
<br />
	<a id="lang_fr" href="#">fr</a>
 
	<a id="lang_en" href="#">en</a>
 
	<a id="lang_de" href="#">de</a>
 
	<a id="lang_es" href="#">es</a>
 
</body>
</html>

après le clique ce message s'affiche :

Code :

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

{"error":true,"msg":"You did not enter you language."}

par contre le message affiché par la fonction de rappel affiche ceux ci :

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
27
{"error":false,"msg":"You've entered: fr."}<!DOCTYPE html>
<html>
<head>
<title>Post</title>
<script type="text/javascript" src="jquery1.7.js"></script>
<script language="javascript" type="text/javascript">
var l="" ;
var id_="";
$(document).ready(function() {    
		$("a").click(function (){ 
			l = $(this).html(); 
			id_=$(this).attr('id');
			alert(l);
			//alert(id_);
			//$.post("jquery.php", {name: lang})
			$.post("jquery.php", {name: l}, function(reponse){alert(reponse);});
		});
});
</script>
</head>
<body>
	<a id="lang_fr" href="#">fr</a>
	<a id="lang_en" href="#">en</a>
	<a id="lang_de" href="#">de</a>
	<a id="lang_es" href="#">es</a>
</body>
</html>

j'arrive pas à comprendre pourquoi le serveur renvois deux résultats différants pour un seul traitment

bizzare non ?

**Bovino** · 29/12/2011, 11h11

Essaye avec

Code :

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

$.post("jquery.php", {'name': l}, function(reponse){alert(reponse);});

Ceci dit, ta page est incorrecte : tu renvoies d'abord un objet JSON puis une page HTML complète...

[AJAX] envoyer une donnée avec jquery et recevoir avec php

AJAX

Discussions similaires

Partager

Partager