Récupérer 3 données sur 1 URL en Ajax

Version imprimable

Voir 40 message(s) de cette discussion en une page

18/08/2010, 10h13
ingeniomatique

Récupérer 3 données sur 1 URL en Ajax
Bonjour à tous,

J'ai un bout de script suivant :
Code:

1 2 3 4 5 6 $.ajax({ url: 'verification.php?pseudo=<? echo "$pseudo"; ?>&play=$picture1', success: function(data) { (..) } });
J'aimerais récupérer depuis la page verification.php plusieurs données, par exemple $donnee1, $donnee2 et $donnee3

Comment pourrais je procéder ?

Merci par avance.
Antoine

Dans ton code JavaScript tu déclares ta requete Ajax comme suit :

Code:

1
2
3
4
5
6
7
8
$.ajax({
		type: "POST",
		url: 'verification.php',		
		success : function(data) {
(..)
},
		data: 'pseudo=PSEUDO&play=PICTURE', //Tu es en JAVASCRIPT les données PSEUDO et PICTURE sont des valeurs JAVASCRIPT et non PHP comme le montre ton exemple.
	});

Dans ton code PHP tu récupère tes valeurs comme ça :

Code:

1
2
3
4
5
6
7
 
<?php
$donnee1 = $_POST['pseudo'];
$donnee2 = $_POST['play'];
...
 
?>

18/08/2010, 10h57
ingeniomatique

Merci pour le tuyau.

Cependant, je dois avoir mal formulé ma question car l'objectif est de récupérer en javascript/ajax PLUSIEURS données qui PROVIENNENT de ma page PHP.

Comment puis je faire ?

Merci.
Antoine
18/08/2010, 11h27
SpaceFrog
ceci devrait t'aider à comprendre ...
Code:

1 2 3 success : function(data) { alert(data) }

Citation:

Envoyé par ingeniomatique

Merci pour le tuyau.

Cependant, je dois avoir mal formulé ma question car l'objectif est de récupérer en javascript/ajax PLUSIEURS données qui PROVIENNENT de ma page PHP.

Comment puis je faire ?

Merci.
Antoine

:mouarf: J'avais effectivement pas compris....
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 $.ajax({ type: "POST", url: 'verification.php', dataType: "json", // ou XML, HTML, TEXT.... Perso j'aime mieux le JSON success : function(data) { alert(data); alert(data.retourJSON); alert(data.retourJSON.donnee1); }, data: 'pseudo=PSEUDO&play=PICTURE' });
Code:

1 2 3 4 5 6 7 <?php $donnee1 = $_POST['pseudo']; $donnee2 = $_POST['play']; ... echo '{"retourJSON": [{"donnee1": "'.$donnee1.'", "donnee2": "'.$donnee2.'", "donnee3": "'.$donnee3.'"}]}' ?>

Je viens d'effectuer de multiples tests avec finalement le script suivant :

Code:

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
<script type="text/javascript">  
$(function(){
 
 $("#conteneur img" ).click(function(){
 $picture1 = $(this);
 
 $.ajax({   
 		type: "POST",
        url: 'jeup4verif.php',
		dataType: "json", 
        success: function(data) { 
alert(data);
alert(data.retourJSON);
alert(data.retourJSON.donnee1);
            $picture1.attr('src', data.retourJSON.donnee1);
			document.getElementById('tour').innerHTML.replace(document.getElementById('tour').innerHTML,'data.retourJSON.donnee3');
			document.getElementById('final').innerHTML.replace(document.getElementById('final').innerHTML,'data.retourJSON.donnee2');
			if (data.retourJSON.donnee3!='') {
clearInterval(monInterval);
}  
        }  
    }); 
 });
});
</script>

J'ai volontairement simplifié le fichier PHP jeup4verif.php :

Code:

1
2
3
<?php
echo '{"retourJSON": [{"donnee1": "test", "donnee2": "test2'", "donnee3": "test3"}]}';
?>

Le souci est que cela ne fonctionne pas.
Une seule ALERT apparaît et donne "null".

Merci par avance de votre aide.

19/08/2010, 20h42
Bovino

En supposant que le ' au milieu du JSON soit une faute de frappe, tu ferais bien de comprendre comment tu as construit celui-ci : ton objet n'a qu'une seule propriété, retourJSON qui a pour valeur un tableau à un élément composé d'un objet (ce qui est un peu tordu au passage...) donc pour accéder aux données, il faut préciser le rang auquel tu veux accéder dans le tableau, même s'il n'y en a qu'un :

Code:

alert(data.retourJSON[0].donnee1);

Mais tu ferais mieux de renvoyer simplement

Code:

{"donnee1": "test", "donnee2": "test2", "donnee3": "test3"}

et d'y accéder avec

Code:

alert(data.donnee1);

Bonjour,

Je viens donc de tester sur jeup4verif.php :

Code:

echo '{"donnee1": "test", "donnee2": "test2", "donnee3": "test3"}';

Et le code devient :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script type="text/javascript">  
$(function(){
 
 $("#conteneur img" ).click(function(){
 $picture1 = $(this);
 
 $.ajax({ 
        url: 'jeup4verif.php?pseudo=<? echo "$pseudo"; ?>&play=$picture1',
        success: function(data) { 
alert(data.donnee1);
alert(data.donnee2);
alert(data.donnee3);
            $picture1.attr('src', data.data.donnee1);
			document.getElementById('tour').innerHTML.replace(document.getElementById('tour').innerHTML,'data.donnee3');
			document.getElementById('final').innerHTML.replace(document.getElementById('final').innerHTML,'data.donnee2');
			if (data.donnee3!='') {
clearInterval(monInterval);
}  
        }  
    }); 
 });
});
</script>

J'ai bien 3 alertes qui s'affichent.

Mais au lieu d'afficher TEST1, TEST2 et TEST3, j'ai 3 fois "undefined".

Merci encore par avance.

20/08/2010, 12h29
Bovino

Essaye comme ça alors :

Code:

echo '{donnee1: "test", donnee2: "test2", donnee3: "test3"}';
20/08/2010, 13h46
ingeniomatique

De la même manière cela donne 3 fois UNDEFINED...
Merci par avance.
20/08/2010, 13h55
Bovino

Euh oui mais dans ton dernier exemple

Code:

dataType: "json",

a disparu :mrgreen:

Il vient de réapparaître comme par magie (sans rien modifier d'autre) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<script type="text/javascript">  
$(function(){
 
 $("#conteneur img" ).click(function(){
 $picture1 = $(this);
 
 $.ajax({ 
        url: 'jeup4verif.php?pseudo=<? echo "$pseudo"; ?>&play=$picture1',
 		dataType: "json",
        success: function(data) { 
alert(data.donnee1);
alert(data.donnee2);
alert(data.donnee3);
            $picture1.attr('src', data.data.donnee1);
			document.getElementById('tour').innerHTML.replace(document.getElementById('tour').innerHTML,'data.donnee3');
			document.getElementById('final').innerHTML.replace(document.getElementById('final').innerHTML,'data.donnee2');
			if (data.donnee3!='') {
clearInterval(monInterval);
}  
        }  
    }); 
 });
});
</script>

Mais cette fois ci... AUCUNE alerte ne s'affiche. Rien.

C'est sans doute une idée à la con mais as-tu essayé de remplacer data par autre chose car j'ai peur qu'il confonde le paramètre data avec la variable de ton retour.
Code:

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 <script type="text/javascript"> $(function(){ $("#conteneur img" ).click(function(){ $picture1 = $(this); $.ajax({ url: 'jeup4verif.php?pseudo=<? echo "$pseudo"; ?>&play=$picture1', dataType: "json", success: function(retourJSON) { alert(retourJSON.donnee1); alert(retourJSON.donnee2); alert(retourJSON.donnee3); $picture1.attr('src', retourJSON.donnee1); document.getElementById('tour').innerHTML.replace(document.getElementById('tour').innerHTML,'retourJSON.donnee3'); document.getElementById('final').innerHTML.replace(document.getElementById('final').innerHTML,'retourJSON.donnee2'); if (retourJSON.donnee3!='') { clearInterval(monInterval); } } }); }); }); </script>
Citation:

Envoyé par Bovino

... ton objet n'a qu'une seule propriété, retourJSON qui a pour valeur un tableau à un élément composé d'un objet (ce qui est un peu tordu au passage...)

En effet sur ce coup je ne suis pas droit du tout. Mais c'est la magie du copier coller d'un de mes scripts j'ai pas corrigé :oops:.

21/08/2010, 18h17
ingeniomatique

Non ce n'est toujours pas ça.

Toujours 3 alert "undefined"...

Merci par avance :)
21/08/2010, 21h02
Bovino

Juste pour vérifier un truc, dans ta page HTML générée, tu n'as pas

Code:

url: 'jeup4verif.php?pseudo=<? echo "$pseudo"; ?>&play=$picture1'

j'imagine, ça donne quoi en HTML ?
21/08/2010, 21h08
ingeniomatique

En HTML ça donne jeup4verif.php?pseudo=foxbond&play=$picture1 ("foxbond" étant mon pseudo)

Effectivement, y'a un souci avec le $picture1 qui devrait être mon ID d'image cliquée ( $picture1 = $(this); )
21/08/2010, 21h12
Bovino
Ah ben voilà :mrgreen:
C'était là depuis le début, mais j'avais pas fait gaffe !
Code:

1 2 $("#conteneur img" ).click(function(){ $picture1 = $(this);
$picture1 correspond à la balise HTML, donc

Code:

jeup4verif.php?pseudo=foxbond&play=$picture1

n'envoie aucune valeur pour le paramètre play :)
21/08/2010, 21h15
ingeniomatique

Ben comment faire pour envoyer $(this) pour le paramètre play alors ?

Par ailleurs je ne suis pas certain que cela résolve le souci d'undefined qui semble être indépendant.
21/08/2010, 21h20
Bovino

Citation:

Envoyé par ingeniomatique

Ben comment faire pour envoyer $(this) pour le paramètre play alors ?

Ca dépend, quelle valeur comptes-tu récupérer ?
Par exemple, si c'est le src, il faut faire

Code:

$picture1 = $(this).src;
21/08/2010, 21h24
ingeniomatique

Code:

$picture1 = $(this).id;

(c'est la balise ID qui m'intéresse)

Ca ne marche pas, en HTML ça m'affiche toujours :

Code:

jeup4verif.php?pseudo=foxbond&play=$picture1

Voir 40 message(s) de cette discussion en une page