Je développe actuellement une interface en Js/Php pour une boutique en ligne. Mon script Javascript exécute les étapes de l'enregistrement du panier et exécute une requête Ajax, pour ainsi transmettre cela coté client en PHP.
l Voici le script JS avec a fonction "save" qui exécute la requête ajax.
RAS a ce niveau là. La requête ajax renvoie le panier, response statut 200 dans l'inspecteur/Réseaux.
Code : Tout sélectionner
// ADD, DELETE & TOTAL PRODUCT
const cart = {
products: [],
total: 0,
// Ajouter
addProduct: function(product) {
this.products.push(product);
this.calculateTotal();
},
// Suprimer
deleteProduct: function(id) {
var index = -1;
for (var i = 0; i < this.products.length; i++) {
if (this.products[i].id === id) {
index = i;
break;
}
}
if (index !== -1) {
this.products.splice(index, 1);
this.calculateTotal();
displayCart();
}
},
// Supp All
deleteAll: function() {
this.products = [];
this.calculateTotal();
displayCart();
this.deleteBasketCookie(); // Appel à la fonction pour supprimer le cookie "basket"
},
// Supprimer le cookie "basket"
deleteBasketCookie: function() {
document.cookie = "basket=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
},
// Save
save: function() {
// Convertissez le panier en chaîne JSON
const cartJSON = JSON.stringify(this);
$.ajax({
type: "POST",
url: "./index.php",
data: { cart: cartJSON },
}).done(function(response) {
//console.log(response); // Affiche le contenu de cartJSON
});
//console.log(cartJSON);
displayCart();
},
// Total
calculateTotal: function() {
var total = 0;
for (var i = 0; i < this.products.length; i++) {
total += this.products[i].price;
}
this.total = Math.round(total * 100) / 100;
}
};
...
// Bouton Suivant
document.addEventListener("DOMContentLoaded", function() {
var nextOneButtons = document.getElementsByClassName("nextOne");
for (var i = 0; i < nextOneButtons.length; i++) {
nextOneButtons[i].addEventListener("click", function() {
cart.save();
});
}
});
<?php
$etatdupanier = 'le panier est vide';
if ($_SERVER["REQUEST_METHOD"] === "POST") {
// Récupérez les données du panier depuis la requête POST
$cartData = $_POST["cart"];
// Vous pouvez décoder les données JSON en un tableau PHP
$cart = json_decode($cartData, true);
// réponse au client
$etatdupanier= "Le panier a été enregistré avec succès.";
} else {
// Gérez les erreurs ou les requêtes non autorisées
$etatdupanier = "Requête invalide.";
}
// ici ces cette variable que je souhaite utiliser dans mon html
echo $etatdupanier;
?>
Mon souci est donc que je n'arrive pas à afficher dans mon html ma variable $etatdupanier mise à jour, mais coté java script et php tout semble bien communiquer.
ici mon html simplifié :
<fieldset>
<div class="form-card">
<div class="row">
<div class="col-7">
<h2 class="fs-title">Personal Information:</h2>
</div>
<div class="col-5">
</div>
</div>
<div id="ajax">
// Je souhaite tous simplement afficher dans ce H5 le résultat qui s'affiche dans l'inspecteur
<h5 class="modal-title"> <span class="text-left titre"> <?= h($etatdupanier); ?> </span></h5>
</div>
</div>
<input type="button" name="next" class="next action-button" value="Next"/>
<input type="button" name="previous" class="previous action-button-previous prevOne" value="Previous"/>
</fieldset>
Je suis bloqué depuis plus d'une semaine sur le sujet c'est le moment de demander de l'aide (GPT à ses limites).
Si vous avez la gentillesse de me débloquer sur ce sujet , vous aurez ma reconnaissance éternelle hihihi je m'arrache les cheveux.
