Récupérer plusieurs valeurs avec xhr.responseText

Version imprimable

bonjour
je voudrais savoir si c'est possible de récupérer plusieurs valeur.
je voudrais afficher une erreur si il y a et l'afficher dans le div erreur.
je ne vois pas comment faire

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
function lookpanier() {
				document.getElementById('vispanier').style.display='block';
				let idart = <?php echo $idan; ?>;
				let article = "<?php echo $titre_astuce; ?>";
				let stock = <?php echo $quanti; ?>;
				let xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour afficher dans le div
						document.getElementById('visupanier').innerHTML = leselect;
						document.getElementById('erreur').innerHTML = leselect;
						}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","anonc/panier.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 
				xhr.send("idan="+idart+"&article="+article+"&stock="+stock);
}

fichier panier

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
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
if (isset($_POST['idan']) AND is_numeric($_POST['idan']) AND !empty($_POST['idan']) AND isset($_POST['stock']) AND !empty($_POST['stock']) AND isset($_POST['article']) AND !empty($_POST['article'])) 
{
$idan = $_POST['idan'];
$article = $_POST['article'];
$stock = $_POST['stock'];
 
 
 
$baspani = $bdd->prepare("SELECT sum(quanti) as quant FROM panier WHERE idan = :idan AND ip = :ip");
	$baspani->execute(array(
	'idan'=> $idan,
	'ip'=> $ip
    ));
 
if ($baspanier = $baspani->fetch()){
 $quanti = $baspanier['quant'];
} else {$quanti = 1; }
 
if ($quanti < $stock){
 
if($quanti > 0){
	$enr = $bdd->prepare("UPDATE panier SET quanti = :quanti, date = NOW() WHERE idan = :idan AND ip = :ip");
	$enr->execute(array(
	'quanti'=> $quanti + 1,
	'idan'=> $idan,
	'ip'=> $ip
    ));	
 
} else {
$quanti = 1;	
$enr = $bdd->prepare("INSERT INTO panier SET idan = :idan, user = :user, ip = :ip, article = :article, quanti = :quanti, date = NOW()");
$enr->execute(array(
	'idan'=> $idan,
	'user'=> $log,
	'ip'=> $ip,
	'article'=> $article,
	'quanti'=> $quanti
));	 
}	
} else {
	$message = "Plus de stock actuellement";
}
$baspan = $bdd->prepare("SELECT sum(quanti) as nbquat FROM panier WHERE ip = :ip");
	$baspan->execute(array(
	'ip'=> $ip
    ));
 
if ($bpanier = $baspan->fetch()){
$quanti = $bpanier['nbquat'];
} 
echo $quanti;
}
else {
	$message = "Problème d'identification du produit";
}
if(isset($message)){
	echo $message;
}

09/09/2023, 14h10
Toufik83

Bonjour,

Il faudrait utiliser le type de données JSON xhr.responseType = 'json'; pour pouvoir récupérer plusieurs valeurs depuis le fichier PHP et les exploiter en JS.
09/09/2023, 22h22
maxtrident

merci, tu as un exemple car je ne vois pas comment récupérer en js
10/09/2023, 01h38
Toufik83

Commences par déclarer une variable de type tableau au début du fichier PHP $data=[]; puis après si tu veux par exemple rajouter le message d'erreur dans le tableau, tu peux le faire comme ça if(isset($message)) $data["erreurMsg"]=$message;, et au niveau JS tu peux l'exploiter comme suite let errMsg=xhr.response.erreurMsg;.

La même chose pour les autres variables ...

Le plus important c'est de supprimer tous les echo et renvoyer seulement le tableau à la fin du traitement echo json_encode($data);

Pour avoir plus de détails sur la requête XMLHttpRequest, tu peux utiliser l'onglet Réseau de l'outil de développement du navigateur.

merci.
j'ai essayer mais me marque undefined sur tous les variables

js

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
function lookpanier() {
				document.getElementById('vispanier').style.display='block';
				let idart = <?php echo $idan; ?>;
				let article = "<?php echo $titre_astuce; ?>";
				let stock = <?php echo $quanti; ?>;
				let xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						let errMsg = xhr.response.erreurMsg;
						let qantpanier = xhr.response.qantpan;
						let messag = xhr.response.mesag;
					console.log(qantpanier);
						if(errMsg !== ''){
							document.getElementById('erreur').innerHTML = errMsg;
						}
						if(qantpanier !== ''){
							document.getElementById('qtpanier').innerHTML = qantpanier;
						}
						if(messag !== ''){
							document.getElementById('message').innerHTML = messag;
						}
						}
				}

php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
} else {
	$message = "Plus de stock actuellement";
	$data["mesag"]= $message;
}
$baspan = $bdd->prepare("SELECT sum(quanti) as nbquat FROM panier WHERE ip = :ip");
	$baspan->execute(array(
	'ip'=> $ip
    ));
 
if ($bpanier = $baspan->fetch()){
$quanti = $bpanier['nbquat'];
} 
 
$data["qantpan"]= $quanti;
}
else {
	$erre = "Problème d'identification du produit";
	$data["erreurMsg"]= $erre;
}
 
echo json_encode($data);

la function get

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
	function getXhr(){
                var xhr = null; 
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest(); 
				else if(window.ActiveXObject){ // Internet Explorer 
				   try {
			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
			            } catch (e) {
			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
			            }
				}
				else { // XMLHttpRequest non supporté par le navigateur 
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
				   xhr = false; 
				} 
                                return xhr;
			}

il ne m'affiche pas erreur...je ne sais pas ou ça cloche

10/09/2023, 12h22
Toufik83
Tu as oublié de définir le type de donnée responseType.

Ajoutes xhr.responseType = 'json'; après la déclaration de xhr :
Code:

1 2 3 4 ... let xhr = getXhr(); xhr.responseType = 'json'; ....
10/09/2023, 12h32
maxtrident

super merci