envoi variable ajax jquery

**amine.h** · 11/07/2009, 08h59

Bonjour,
j'aimerais faire une requete Ajax
j'ai un tableau qui contient la liste des professeur, pr chaque td j'ai mit le identifiant du prof correspndant
quand je click je voudrais qu'il envoit la variable "identifiant" vers le fichier php. ce dernier affiche les information du prof et l'affiche.

j'aimerais juste savoir le code javascript qui permet d'envoyé la variable avec ajax
merci d'avance

**danielhagnoul** · 11/07/2009, 10h42

Bonjour, voir la documentation jQuery

La méthode post : http://docs.jquery.com/Ajax/jQuery.p...tacallbacktype

**amine.h** · 11/07/2009, 11h15

oui, j'ai fait exactement cela, il me reste juste comment inçéré la réponse du fichier php, dans une div. merci

**danielhagnoul** · 11/07/2009, 19h03

Bonsoir.

Si vous avez suivit l'exemple $.post() et si la transaction est un succès la réponse est dans data. Mais cette réponse peut être un texte, un chiffre, un tableau, un lien, etc. Impossible de vous aider sans savoir de quoi il s'agit.

**amine.h** · 12/07/2009, 10h36

Je vous remerci beaucoup pour votre aide, je vous montre mon premier fichier :

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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr-FR" xml:lang="fr-FR">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<title>Insertion</title>
<link rel="stylesheet" type="text/css" href="demo.css" />
<script src="jquery-1.3.2.js" type="text/javascript" > </script>
<script type ="text/javascript" >
 
$(document).ready(function() { 
 
 
$(".tab td").bind("click", function (e) {
var jjj = $(this).attr("id") ;
 
console.log (jjj) ; 
 
 
}); 
 
 
$("td").click(function () {
$.ajax({
data: "jjj=jjj",
url: "cible.php",
cache:false,
success:function(html){
afficher(html);
},
error:function(XMLHttpRequest,textStatus, errorThrown){
alert("(086) Erreur de chargement...");
}
})
});
 
 
function afficher(data) {
$("#contenu").slideUp(400, function() {  
$("#contenu").empty();
$("#contenu").append(data);
$("#contenu").slideDown(500);
}); 	
}
}) ;
 
</script>
 
 
 
</head>
<body>
<div class="tab">
	<table border ="1px" width ="300px" height ="500px">
	<?php
	mysql_connect("localhost", "root", "");
	mysql_select_db("item"); 
 
 
	$result= mysql_query("SELECT  COD_MODU, LIBEL_MODU 
            from module");
	while ($donnees = mysql_fetch_array($result)) { ?>
	<tr>
		<td id ="<?php echo $donnees['COD_MODU'] ; ?>" class ="mama">
			<?php echo  $donnees['LIBEL_MODU'] ; ?>
		</td>
	</tr>
	<?php } ?>
 
</table>
 
 
 
</div>
 
<div id ="contenu">
 
</div>
 
 
</body>
<html>
 
 
 
et le fichier cible
 
 
<?php
 
$jjj = $_POST['jjj'];
echo $jjj ;
echo "ffffffff" ;
 
?>

j'ai mis juste ce petit code, pour tester si le fichier cible obtient vraiment la variable envoyé

avec cela, ca m'affiche juste "ffffffff", ca ne m'affiche pas la valeur de la variable
malgré que quand je lé testé sur la console de firebug "console.log (jjj) ; sur le premier fichier", ca m'affiche bien sa valeure.

**danielhagnoul** · 12/07/2009, 22h19

Bonsoir.

S.V.P., veuillez éditer votre précédent message et utiliser les balises code, le bouton # dans la boite de dialogue. Un code qui utilise les balises code et bien mis en forme est un gain de temps appréciable.

Avec Web Developer, je peux écrire une page xhtml en tapant uniquement du texte et du C#, mais en PHP mon expérience est à J-1, c'est-à-dire que j'envisage sérieusement de m'y mettre !

Mais comme votre exemple était simple, à priori, je me suis lancé dans mon troisième exercice en PHP. Comme il fonctionne correctement chez moi, et pour vous aider, voici ma page xhtml et ma page 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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="Author" content="Daniel Hagnoul" />
	<title>Page type</title>
	<style type="text/css">
		body {
			background-color:#696969;
			color:#000000;
			font-family:Arial, Helvetica, sans-serif;
			font-size:medium;
			font-style:normal;
			font-weight:normal;
			line-height:normal;
			letter-spacing:normal;
		}
		h1,h2,h3,h4,h5 {
			font-family:"Times New Roman", Times, serif;
		}
		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img {
			margin:0px;
			padding:0px;
		}
		p {
			padding:6px;
		}
		ul,ol,dl {
			list-style:none;
			padding-left:6px;
			padding-top:6px;
		}
		li {
			padding-bottom:6px;
		}
		div#conteneur {
			width:95%;
			margin:12px auto;
			padding:6px;
			background-color:#FFFFFF;
			color:#000000;
			border:1px solid #666666;
			font-size:0.8em;
		}
		div#affiche {
			margin:12px;
			border:1px solid #999999;
		}
	</style>
	<script type="text/javascript" src="lib/jquery-1.3.2.min.js"></script>
	<script type="text/javascript">
			$(document).ready(function(){
 
				var tdID;
 
				$(".tab td").bind("click", function(){
					tdID = this.id;
 
					$.post("efface1.php", {name: tdID}, function(data){
 
						//alert("mon id = " + data.nom);
						//alert("mon texte = " + data.texte);
 
						$("#affiche").html("<p>ID = " + data.nom + ", texte = " + data.texte + "</p>");
 
					}, "json");
 
				});
 
			});
	</script>
</head>
<body>
	<div id="conteneur">
		<div class="tab">
			<table border ="1px" width ="300px" height ="500px">
					<tr>
						<td id="tdTableID">
							Un contenu inconnu.
						</td>
					</tr>
			</table>
		</div>
		<div id="affiche"></div>
	</div>
</body>
</html>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<?php
        $id = $_POST['name'];
        $texte = "Je suis un texte retourné par la page php !";
                
        echo json_encode(
                array(
                        "nom" => $id,
                        "texte" => $texte
                )
        );
?>

Je pense être arrivé à quelque chose de valable, mais si un expert en PHP vient à passer il serait aimable de nous donner son opinion.

**zoutigo** · 21/07/2009, 19h34

voici une soluttion:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
$(document).ready(function () {
$(':submit').click(function(){
 
    var cate = $(this).attr("value");
    $("#ton objet").load("essai.php?zone=jeu&action=''&cate="+cate+"");
   return false;
 
});
 
});

tu peux utiliser la methode get ou bien post aussi.
Dans mon exemple, c'est le load. et de ce fait, je transmet mes variables par l'url. Mon mon cas, mon objet était un input de type hidden.

voilà!

**amine.h** · 22/07/2009, 19h05

Je vous remerci beaucoup ca marche, enfin après des jours de recherche, j'ai pu en arrivé grace à voter aide.
merci encore
Amine

envoi variable ajax jquery

jQuery

Discussions similaires

Partager

Partager