Comment passer une variable de php vers javascript

Résolu/Fermé
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - 11 août 2022 à 11:20
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - 13 août 2022 à 12:21

Bonjour a tous

dans un but purement éducatif j'essaye de comprendre le passage des données de html vers le javascript ajax

j'ai donc un bon de commande dont je pense avoir compris son fonctionnement depuis le temps que je suis dessus

Mais il y a un point qui reste en interrogation 

c'est la passage des données de html vers javascript

j'ai donc 3 pages 

la première index.html

la deuxième mail.php 

La troisième panier .js

J'ai bien compris comment passer les données de html vers php  pour ensuite réaliser la mise en base de données et l'envois par mail

Par contre pour récupérer des informations de html vers la page javascript cela est encore un peu flou

dans mon exemple j'ai ce morceau de code qui sert a choisir le mode de livraison 

 <div class="container">
                <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;display: none;">
                  <div class="col-sm ">
                    <input type="radio" name="choix_livraison" class="choix_livraison articleBtnposteinvisible" checked="checked" data-lang="de" data-nom="" value="" onclick="ouvreMaJolieAlertposte(event,'  ');"> Par poste enveloppe (je ne suis pas responsable des pertes éventuelles) 1,10 euros
                  </div>
                </div>
                <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;">
                  <div class="col-sm ">
                    <input type="radio" name="choix_livraison" class="choix_livraison articleBtnposte" data-lang="de" data-nom="POSTE-ENVELLOPPE-belgique" value="1" onclick="ouvreMaJolieAlertposte(event,'  ');"> Par poste enveloppe (je ne suis pas responsable des pertes éventuelles) 1,10 euros
                  </div>
                </div>
                <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;">
                  <div class="col-sm ">
                    <input type="radio" name="choix_livraison" class="choix_livraison" data-nom="MONDIAL-RELAY-BELGIQUE" data-lang="be" value="3"> Par Mondial Relay avec suivi du colis 3 euros
                  </div>
                </div>
                <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;">
                  <div class="col-sm ">
                    <input type="radio" name="choix_livraison" class="choix_livraison" data-nom="POSTE-COLIS-BELGIQUE" value="6.50"> Par poste colis avec garanti a votre domicile 6.50 euros
                  </div>
                </div>
                <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;">
                  <div class="col-sm ">
                    <input type="radio" name="choix_livraison" class="choix_livraison" data-nom="POSTE-COLIS-BELGIQUE_point" data-lang="fr" value="5.50"> Par poste dans un point d’enlèvement 5.50 euros
                  </div>
                </div>
              </div>

  qui sont ensuite récupéré sur la page panier.js de cette manière 

	const cases = document.querySelectorAll('input[name="choix_livraison"]');
		for (const x of cases) {
			if (x.checked) {
				let nom_choix_livraison = x.dataset.nom;
				let prix_choix_livraison = x.value;
				let prix_et_livraison = (( (MonPanier.totalpanier()))) + Number(prix_choix_livraison)  ;
				//let test= ((( (MonPanier.totalpanier()))) + Number(prix_choix_livraison) ).toFixed(2);
let test= MonPanier.totalpanier();
document.getElementById('amount').value = prix_et_livraison ;

$('.total-panier').html(prix_et_livraison.toFixed(decimal));
document.getElementById('livraison-detail').innerHTML ="(" + nom_choix_livraison + ")" + prix_choix_livraison + " euro(s)";
document.getElementById('modal_erreur').innerHTML =nom_choix_livraison ;
document.getElementById('modal_erreur_mondial').innerHTML =nom_choix_livraison ;
document.getElementById('nouveau_prix_total_haut').innerHTML =((( (MonPanier.totalpanier()))) ) .toFixed(2) ;
document.getElementById("prix_depart_haut").innerHTML  = MonPanier.totalpanier(); 
document.getElementById("prix_depart").innerHTML  = MonPanier.totalpanier(); 
break;
			}
		}

j'ai bien compris comment cela fonctionne 

Voici ma question 

Imaginons que je donne a l'utilisateur un champ pour entrer une information que je souhaite récupéré dans mon fichier panier .js afin de la traiter a l'intérieur du morceau de code de javascript ici plus haut 

Le tout sans recharger la page index.html de la même manière que cela se fait avec le bouton  radio du formulaire du choix du mode de livraison 

comment je pourrais m'y prendre ?

Surement avec un formulaire , mais ensuite comment envoyer ces infos vers la panier.js sans pour cela recharger index.html

Merci de l'aide

A voir également:

15 réponses

yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 Ambassadeur 1 557
11 août 2022 à 13:52

bonjour,

La complexité de ton code t'empêche de comprendre ce qu'il fait en réalité.  Si tu veux comprendre le principe, laisse de côté ton code complexe, et crée un petit code simple, exemple: https://www.delftstack.com/fr/howto/javascript/get-html-form-value/

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
11 août 2022 à 12:36

je suis parvenu a faire passer de html vers javascript et récupérer value et name sur le html

avec ce code en html

<div class="container">
  <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;">
    <div class="col-sm ">
      <input type="radio" name="testphil" class="testphil" data-nom="essai1" data-lang="be" value="3"> essai1
    </div>
  </div>
</div>
<span style="color:#f50813;" id="azerty"></span>
<span style="color:#f50813;" id="azerty111"></span>

en javascript dans la page panier.js

je traite cela de cette manière

$('.testphil').click(function() {
	const cases = document.querySelectorAll('input[name="testphil"]');
	for (const x of cases) {
		if (x.checked) {
		afficherpanier();
	}}
});

 et ce code

		const essai = document.querySelectorAll('input[name="testphil"]');
		for (const x of essai) {
			if (x.checked) {
				let test = x.dataset.nom;
				let test2 = x.value;
				
document.getElementById('azerty').innerHTML =test2;
document.getElementById('azerty111').innerHTML =test;

			}
		}

Mais comment réaliser cela avec un formulaire dans lequel l'utilisateur entre une donnée qui sera récupérée sur la page panier.js sans rafraichir index.html

avec ce code par exemple

	<form action="" method="post">
			<TR><TD>test</TD><TD><INPUT Type="Text" name="testphil" class="testphil" value="5" ID="test"></INPUT></TD></TR>
					<input type="submit" value="Envoyer" />
		</form>
0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
11 août 2022 à 14:05

Le code que tu donnes comme exemple contient un formulaire qui semble plutôt destiné à être envoyé à du PHP.  Est-ce intentionnel, ou un indice de confusion?
Pour récupérer dans la variable flex du JavaScript la donnée dans le formulaire:

flex = document.getElementById("test").value
0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187 > yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024
11 août 2022 à 14:12

Merci pour la reponse

comme je ne sais pas comment faire j'ai écris ce code de manière intentionnel tout en sachant que cela n'est pas bon et effectivement c'est pour passer du html vers le php

ce que je souhaite c'est transmettre les données a panier .js

ce que je désire ce n'est pas d'afficher les données sur la page html , mais de les transmettre a panier.js pour les traiter 

0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557 > flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024
11 août 2022 à 15:47

La ligne de code suggérée permet à panier.js de traiter la donnée.

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187 > yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024
11 août 2022 à 15:53

Merci de ton aide

Mais le code suggéré doit être placé  en javascript alors , pour que je puisse faire passer l'id dans flex ?

flex = document.getElementById("test").value

Mais dans mon formulaire lorsque je vais l'envoyer ma page html va se recharger?

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 11 août 2022 à 14:07

bonjour

Merci pour la réponse

je vais voir cela

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
11 août 2022 à 14:32

Merci pour l'exemple , mais ce que je souhaite c'est envoyer des données de html vers panier.js

0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557 > flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024
11 août 2022 à 16:04

En réalité, panier.js contient des instructions.  Tu dois donc, un moment, exécuter ces instructions.  Ces instructions peuvent lire les données html.

Qu'est-ce qui déclenche l'exécution des instructions?  Qui fera que panier.js ira lire les données.

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 11 août 2022 à 16:20

Merci pour la patience et l'aide

en fait javascript va se servir de l'id du fichier en html pour lui donner une valeur 

Comme cet exemple

document.getElementById("prix_depart").innerHTML  = prix_choix_livraison;  

il retournera au fichier html grâce a l id prix_depart la variable  prix_choix_livraison

Mais cette variable a été récupérée grâce a un bouton radio en html

	const cases = document.querySelectorAll('input[name="choix_livraison"]');
		for (const x of cases) {
			if (x.checked) {
				let nom_choix_livraison = x.dataset.nom;
				let prix_choix_livraison = x.value;
0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
11 août 2022 à 16:59

Parlons de page, pas de fichier.

A un moment donné, le navigateur traite une page, qui contient du code html, qui peut include du code javascript.  Les éléments de cette page peuvent être dans des fichiers incus, ou pas.

Ton premier exemple montre comment le code javascript peut modifier un élément de la page. Le second montre comment le code javascript peut lire un élément de la page.

L'exemple donné en #2 contenait les deux actions.

Ce qui te manques, je pense, c'est la compréhension de quand le code javascript est exécuté.  Dans l'exemple en #2, il est exécuté quand on clique le bouton du formulaire.

Dans les exemples que tu donnes, tu n'expliques pas "quand", et tu ne montres pas les instructions qui permettent de comprendre le "quand".

Ta vraie question, probablement, c'est: "Comment déclencher l'éxécution d'instructions javascript?".

1

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 11 août 2022 à 20:40

Merci pour cette explication mais le code 1 et 2 sont semblables(peut être 

Voici comme se déroule le fonctionnement de mon formulaire

La première étape je rentre des articles dans mon panier a chaque exécution du bouton d'un article en html

il y a un objet article qui s'ajoute au précèdent ou qui est effacer ect...grâce au code javascript qui le matérialise pour le traiter 

Ensuite il y a le traitement  du choix de la livraison 

Lorsque un utilisateur clic sur un des boutons radio l y a un évènement qui est déclencher en javascript 

Qui récupère le data nom et le value afin de pouvoir créer 2 nouvelles variables  

qui serviront aux différentes actions exécutées en javascript et affichée sur la page html

Suivront par la suite le remplissage des coordonnées de l'utilisateur 

Une fois que tout est ok 

On appuie sur le bouton commander 

qui de par son action va récupérer toutes les variables en php que cela soit au niveaux des articles 

du moyen de livraison

des coordonnées postal

de mondial relay

et passer toutes ces variables dans la page Mail.php qui seront traitées afin de pouvoir être insérée dans la base de donnée et envoyer par mail 

Alors non le code de livraison ne s'exécute pas quand on clic sur le bouton du formulaire mais bien lorsque on choisit un mode de livraison 

Donc lors du choix du moyen de livraison par un utilisateur 

ce mécanisme se mets en fonctionnement dans la page panier.js

		const cases = document.querySelectorAll('input[name="choix_livraison"]');
		for (const x of cases) {
			if (x.checked) {
				let nom_choix_livraison = x.dataset.nom;
				let prix_choix_livraison = x.value;
				let prix_et_livraison = (( (MonPanier.totalpanier()))) + Number(prix_choix_livraison)  ;
				//let test= ((( (MonPanier.totalpanier()))) + Number(prix_choix_livraison) ).toFixed(2);
let test= MonPanier.totalpanier();
document.getElementById('amount').value = prix_et_livraison ;

$('.total-panier').html(prix_et_livraison.toFixed(decimal));
document.getElementById('livraison-detail').innerHTML ="(" + nom_choix_livraison + ")" + prix_choix_livraison + " euro(s)";
document.getElementById('modal_erreur').innerHTML =nom_choix_livraison ;
document.getElementById('modal_erreur_mondial').innerHTML =nom_choix_livraison ;
document.getElementById('nouveau_prix_total_haut').innerHTML =((( (MonPanier.totalpanier()))) ) .toFixed(2) ;
document.getElementById("prix_depart_haut").innerHTML  = MonPanier.totalpanier(); 
document.getElementById("prix_depart").innerHTML  = MonPanier.totalpanier(); 
break;
			}
		}

avec ce morceau de code en plus sur la page panier.js

$('.choix_livraison').click(function() {
	const cases = document.querySelectorAll('input[name="choix_livraison"]');
	for (const x of cases) {
		if (x.checked) {
		afficherpanier();
	}}
});

j'ai réalisé un petit morceau de code que j'ai inséré pour bien comprendre comment tout cela était géré

en réalisant ceci dans la page panier.js

Encore une fois je voulais être sur de bien comprendre le fonctionnement entre html et javascript

$('.testphil').click(function() {
	const cases = document.querySelectorAll('input[name="testphil"]');
	for (const x of cases) {
		if (x.checked) {
		afficherpanier();
	}}
});

et  ceci toujours dans la page panier.js

		const essai = document.querySelectorAll('input[name="testphil"]');
		for (const x of essai) {
			if (x.checked) {
				let test = x.dataset.nom;
				let test2 = x.value;
				
document.getElementById('azerty').innerHTML =test2;
document.getElementById('azerty111').innerHTML =test;

			}
		}

en html j'ai inséré ce code 

<div class="container">
  <div class="row " style="background: #ECE9E7;margin-bottom:10px;border-color: #000;border-style : solid;border-width : 5px;">
    <div class="col-sm ">
      <input type="radio" name="testphil" class="testphil" data-nom="essai1" data-lang="be" value="3"> essai1
    </div>
  </div>
</div>
<span style="color:#f50813;" id="azerty"></span>
<span style="color:#f50813;" id="azerty111"></span>

donc cela fonctionne parfaitement 

Mais ce n'est pas ce que je désire

Je désire  que l'utilisateur puisse avoir un champs a remplir avec un bouton et que lors de l'actionnement du bouton sur la page html

une variable puisse être crée sur la page javscript sans recharger le html et qu'ensuite cette variable puisse être utilisée

pour effectuer des calculs 

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 11 août 2022 à 22:00

je pense avoir trouve ce que je cherchais

voici la page php

<form class="form">
<label>Entre ton nom</label>
<input type="text" id="nom" name="Nom" placeholder="Nom" value="" class="form-control">
<input type="button" name="Envoyer" class="btn btn-default" value="Envoyer" onclick="myFunction();">
</form>
 <script src="""></script>
   <p style ="  font-size: 45px;"id="deux"></p>

et voici la page de test-envois.js

function myFunction(){
  var x = document.getElementById("nom").value;
  //document.getElementById("demo").innerHTML =x ;
affichepanier(x);
 
}

function affichepanier(val)
{
  var variableOfFunction1 = val;
  document.getElementById("deux").innerHTML ="<div class='col' style='text-align:right;background-color: #78b8df;'> " + variableOfFunction1 + " euro(s)</div>"
 }
0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
12 août 2022 à 06:57

cela semble fonctionner aussi

<!DOCTYPE html> 
<html> 
  <body> 
    <h4> 
      Change the text of the text field  
      ,and then click the button. 
  </h4> 
  <label for="domTextElement">Name: </label>
  <input type="text" id="domTextElement" > 
   <button type="button"  onclick="getValueInput()"> 
      click me!! 
  </button> 
   <script src=""></script>
   <p id="valueInput"></p> 
</body> 
</html> 

et ce code sur la deuxième page

    const getValueInput =() =>{
      let inputValue = document.getElementById("domTextElement").value; 
      document.getElementById("valueInput").innerHTML = inputValue; 
    }
0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
12 août 2022 à 10:31

Peux-tu alors marquer la discussion comme résolue?

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
12 août 2022 à 14:56

pas encore car je n'arrive pas a le faire fonctionner  dans ma page panier.js

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 12 août 2022 à 15:47

voila je viens d'effectuer des tests 

si j'insère mon code de test  dans la condition de livraison=2 juste après l'accolade 

	if (Livraison == 2)
	
	{
	    	//test
  const getValueInput =() =>{
      let inputValue = document.getElementById("domTextElement").value; 
      document.getElementById("valueInput").innerHTML = inputValue; 
    }
//suite du traitement de la condition

Ce morceau de code en test ne fonctionne pas (rien n'est retourné) et m'indique cette erreur

Uncaught ReferenceError: getValueInput is not defined

Par contre si je l'insère juste avant la toute dernière  ligne qui est afficherpanier();cela fonctionne  ...

j'ai donc bien la valeur de l'input qui est affichée

voici le code complet de panier.js qui ne fonctionne pas et m'indique l'erreur  Uncaught ReferenceError: getValueInput is not defined

var Livraison = 2;

// Comment affiche-t-on les prix du panier et du total
// Pour rappel, les prix des produits sont à modifier via les attributs HTML data-prix dans le fichier index.php
// 0 pour aficher aucune décimale : 19 euros
// 2 pour afficher deux décimales : 19.00 euros
var decimal = 2;

// Ne pas modifier la suite sauf si vous désirez modifier le code
var MonPanier = (function() {
	panier = [];
	
	function Item(nom, prix, quantite,url) {
		this.nom = nom;
		this.prix = prix;
		this.quantite = quantite;
		this.url = url;
			 //console.log(url);
		}

	function savepanier() {
		sessionStorage.setItem('MonPanier', JSON.stringify(panier));
	//	console.log(setItem);
	//	console.log(JSON.stringify(panier));
	//console.log(('MonPanier', JSON.stringify(panier)));
		//console.log(sessionStorage.setItem('MonPanier', JSON.stringify(panier)));
		
	}

	function loadpanier() {
		panier = JSON.parse(sessionStorage.getItem('MonPanier'));
	}
	
	if (sessionStorage.getItem("MonPanier") != null) {
		loadpanier();
	}

	var obj = {};

	obj.ajouter_produit_dans_panier = function(nom, prix, quantite,url) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				if(quantite)
				{
					panier[item].quantite = Number(quantite);
				}
				else 
				{
					panier[item].quantite ++;
				}
				savepanier();
				return;
				
			}
		}
		var item = new Item(nom, prix, quantite,url);
		//console.log(quantite);
		panier.push(item);
		savepanier();
	}

	obj.setquantiteForItem = function(nom, quantite) {
		for(var i in panier) {
			if (panier[i].nom === nom) {
				panier[i].quantite = quantite;
				break;
			}
		}
	};

	obj.enlever_produit_de_panier = function(nom) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				panier[item].quantite --;
				if(panier[item].quantite === 0) {
					panier.splice(item, 1);
				}
			break;
			}
		}
		savepanier();
	}

	obj.enlever_produit_de_panier_tous = function(nom) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				panier.splice(item, 1);
				break;
			}
		}
		savepanier();
	}

	obj.clearpanier = function() {
	    panier = [];
		savepanier();
	}

	obj.totalquantite = function() {
		var totalquantite = 0;
		for(var item in panier) {
			totalquantite += Number(panier[item].quantite);
	}
		return Number(totalquantite);
	}
//prix total panier
	obj.totalpanier = function() {
		var totalpanier = 0;
		for(var item in panier) {
			totalpanier += panier[item].prix * panier[item].quantite;
		}
	return Number(totalpanier.toFixed(decimal));
	}

	obj.listpanier = function() {
		var panierCopy = [];
		for(i in panier) {
			item = panier[i];
			itemCopy = {};
			for(p in item) {
				itemCopy[p] = item[p];
			}
			itemCopy.total = Number(item.prix * item.quantite).toFixed(decimal);
			panierCopy.push(itemCopy)
		}
	return panierCopy;
	}

	return obj;
})();

function changeQte(element){
	var qte = element.value;
	var t = $(element);
	var label = t.attr("aria-label");
    $("[data-nom='"+ label +"']").attr('data-qte', qte);
}


$('.ajouter-panier').click(function(event) {
	event.preventDefault(); 
	var nom_option = "";
	var prix_option = 0;
	var url= $(this).data('url');
	var option_checkbox = $(this).data('checkbox');
	if (option_checkbox != "") 
	{
		var checkboxes = document.getElementsByClassName(option_checkbox);
			for(var i = 0; i < checkboxes.length; i++) {
				if (checkboxes[i].checked == true) {
					var nom_option = nom_option + " (" + $(checkboxes[i]).data('nom') +")";
					var prix_option = prix_option + Number($(checkboxes[i]).data('prix'));
				}
			}
	}  
	if ($(this).data('select')) 
	{
		var nom = $(this).data('nom') + " (" + document.getElementById(""+$(this).data('select')+"").value + ")" + nom_option;
	}
	else var nom = $(this).data('nom');
	var prix = Number($(this).data('prix')) + (prix_option);
	if ($(this).attr('data-qte'))
	{
		var qte_option = $(this).attr('data-qte');
		MonPanier.ajouter_produit_dans_panier(nom, prix, qte_option,url);
	}
	else MonPanier.ajouter_produit_dans_panier(nom, prix, 1,url);
	afficherpanier();
});

$('.clear-panier').click(function() {
    MonPanier.clearpanier();
	afficherpanier();
});

$('.choix_livraison').click(function() {
	const cases = document.querySelectorAll('input[name="choix_livraison"]');
	for (const x of cases) {
		if (x.checked) {
		afficherpanier();
	}}
});

function afficherpanier() {
	var panierArray = MonPanier.listpanier();
	var output = "";
	 var countart=0;
    var countart2=0;
    var count=0;
	for(var i in panierArray) {
		output += "<div class='row' style='border-style: ridge;  border-width: 1px; border-color: #8ebf42; background-color: #d9d9d9;margin-bottom:5px;'>"
		+ "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'><button class='btn btn-danger effacer-item' data-nom='" + panierArray[i].nom + "'>X</button></div>"
		 + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + " <a class='example-image-link' href='"+ panierArray[i].url +"'data-lightbox='example-set'><img src=""""  style='width:100px;height:100px;'></a>" + "</div>"
		  + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].nom + "</div>" 
		  + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].prix.toFixed(0) + "  euro</div>"
		  
		 + "<div class='form-inline col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'><div class='input-group'><button class='btn btn-primary moins-item' data-nom='" + panierArray[i].nom + "'>-</button>"
		 + "<input type='number' min='1' class='form-control item-quantite' style='width:55px !important' data-nom='" + panierArray[i].nom + "' value='" + panierArray[i].quantite + "'>"
			 
		 + "<button class='btn btn-primary plus-item' data-nom='" + panierArray[i].nom + "'>+</button></div></div>"
		  
		  + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].total + " euros</div>" 
       +  "</div>";
       count++;
       countart += panierArray[i].quantite;  // somme des unités d'articles
       countart2 = countart
       //console.log(panierArray[i].quantite );
       //console.log(countart );
       //console.log(panierArray[i].quantite );
	}
	$('.show-panier').html(output);

	if (Livraison == 2)
	
	{
	    	//test
  const getValueInput =() =>{
      let inputValue = document.getElementById("domTextElement").value; 
      document.getElementById("valueInput").innerHTML = inputValue; 
    }

	//test
		const cases = document.querySelectorAll('input[name="choix_livraison"]');
		for (const x of cases) {
			if (x.checked) {
				let nom_choix_livraison = x.dataset.nom;
				let prix_choix_livraison = x.value;
				let prix_et_livraison = (( (MonPanier.totalpanier()))) + Number(prix_choix_livraison)  ;
				//let test= ((( (MonPanier.totalpanier()))) + Number(prix_choix_livraison) ).toFixed(2);
let test= MonPanier.totalpanier();
document.getElementById('amount').value = prix_et_livraison ;

$('.total-panier').html(prix_et_livraison.toFixed(decimal));

document.getElementById('livraison-detail').innerHTML ="(" + nom_choix_livraison + ")" + prix_choix_livraison + " euro(s)";



document.getElementById('modal_erreur').innerHTML =nom_choix_livraison ;
document.getElementById('modal_erreur_mondial').innerHTML =nom_choix_livraison ;
document.getElementById('nouveau_prix_total_haut').innerHTML =((( (MonPanier.totalpanier()))) ) .toFixed(2) ;
document.getElementById("prix_depart_haut").innerHTML  = MonPanier.totalpanier(); 
document.getElementById("prix_depart").innerHTML  = MonPanier.totalpanier(); 
break;
			}
		}
	}
	
	$('.total-panier-modal').html(MonPanier.totalpanier());
	$('.total-quantite').html(MonPanier.totalquantite());
	if ((Qte_Minimum == 1) && (Math.sign(MonPanier.totalquantite() - Qte_Minimum_Valeur) == -1) && (MonPanier.totalquantite() != 0))
	{
		//document.getElementById('qte_minimum_report').innerHTML = txt_qte_minimum_bad;
	}
	else if ((Qte_Minimum == 1) && ((Math.sign(MonPanier.totalquantite() - Qte_Minimum_Valeur) == 1) || (Math.sign(MonPanier.totalquantite() - Qte_Minimum_Valeur) == 0)) && (MonPanier.totalquantite() != 0))
	{
		//document.getElementById('qte_minimum_report').innerHTML = txt_qte_minimum_ok;
	}
	else if (Qte_Minimum == 1)
	{
		//document.getElementById('qte_minimum_report').innerHTML = txt_qte_minimum_defaut;  
	}
	else if (Qte_Minimum == 0)
	{
		//document.getElementById('qte_minimum_report').innerHTML = "";
	} 
	//document.getElementById('total_qte_haut').innerHTML = MonPanier.totalquantite();
	document.getElementById('total_qte').innerHTML = MonPanier.totalquantite();
	document.getElementById('total_qte_bas').innerHTML = MonPanier.totalquantite();
	document.getElementById('total_qte_modal').innerHTML = MonPanier.totalquantite();
}

$('.show-panier').on("click", ".effacer-item", function(event) {
	var nom = $(this).data('nom')
	MonPanier.enlever_produit_de_panier_tous(nom);
	afficherpanier();
})

$('.show-panier').on("click", ".moins-item", function(event) {
	var nom = $(this).data('nom')
	MonPanier.enlever_produit_de_panier(nom);
	afficherpanier();
})

$('.show-panier').on("click", ".plus-item", function(event) {
	var nom = $(this).data('nom')
	MonPanier.ajouter_produit_dans_panier(nom);
	afficherpanier();
})

$('.show-panier').on("change", ".item-quantite", function(event) {
	var nom = $(this).data('nom');
	var quantite = Number($(this).val());
	MonPanier.setquantiteForItem(nom, quantite);
	afficherpanier();
});

afficherpanier();
0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
12 août 2022 à 16:32

Merci de partager le message d'erreur complet, avec, au minimum, le numéro de la ligne en erreur.  A quel moment obtiens-tu cette erreur?

Je ne comprends pas ce que tu essaies de réaliser.

Cela n'a de sens de partager ton code javascript que si tu partages également le code source HTML de ta page (à obtenir via le navigateur).

Je recommande fortement que tu continues plutôt sur un exemple plus simple, comme celui  que j'ai partagé en #2.  Tu peux le modifier, de façon à comprendre les principes de base.  Quand tu seras à l'aise, tu pourras appliquer tes connaissances sur ton programme complexe.

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
12 août 2022 à 16:58

Merci pour ton aide et la réponse

voici le message d'erreur complet

j'obtiens ce message lorsque je rentre un nom dans le  champ et input et que je clic sur envoyer

je souhaiterais juste pouvoir récupérer la valeur que je vais rentrer en html afin de me permettre de faire des calculs complémentaires suivant ce que l'utilisateur entrera comme donnée,   dans la condition de la livraison 

Partager le code html cela n'est pas possible il y a près de 18000 lignes 

Mais que je place ce code ou je veux dans le fichier html et que je mette le test code de javasscript juste avant la dernière ligne de mon fichier javascript cela fonctionne

<label for="domTextElement">Name: </label>
  <input type="text" id="domTextElement" > 
   <button type="button"  onclick="getValueInput()"> 
      click me!! 
  </button> 

Avec un exemple simple cela fonctionne correctement ou encore une fois ci ce morceau de code est place juste avant la dernière ligne de la page panier.js

0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
12 août 2022 à 17:16

La place correcte de ce code est, en effet, en dehors de toute déclaration de fonction.  Donc, par exemple, avant la dernière ligne.

Moi je ferais plutôt ainsi, toujours au même endroit, avant la dernière ligne:

function getValueInput()  {
      let inputValue = document.getElementById("domTextElement").value; 
      document.getElementById("valueInput").innerHTML = inputValue; 
    }

Toutefois, je ne comprends toujours pas à quoi sert le nouveau bouton, "click me!!".  Il n'est pas nécessaire d'ajouter un bouton pour faire des calculs complémentaires suivant ce que l'utilisateur a entré comme donnée.  Toutes ces données sont directement accessible par le code.

Tu peux écrire, directement:

	if (Livraison == 2)
	
	{
      let inputValue = document.getElementById("domTextElement").value; 
    }

Il est nécessaire que tu expliques, du point de vue de l'utilisateur, pas du point de vue du code, à quoi sert ce nouveau bouton.

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 12 août 2022 à 20:05

En fait voici ce que je souhaiterais faire 

lorsque je souhaite qu'un client puisse bénéficier d'une promo je lui donne un code par exemple "azerty789"

Ce code je le compare avec ce qu'il va entrer dans le champ si le code est bon la ristourne se réalise

si le code est mauvais il n'y pas de remise  

C'est pour cela que j'en ai besoin pour le calcul dans la condition de livraison 2

Même si comme on me l'as expliqué l'utilisateur pourrait voir les codes promo dans le code

Je viens d'essayer ton exemple mais malheureusement avec la condition j'ai toujours le message qui est retourne "votre code est mauvais"

	if (Livraison == 2)
	
	{
	    
	  
      let inputValue = document.getElementById("domTextElement").value; 
      
       if (inputValue == 'azerty') {
 document.getElementById("valueInput").innerHTML ="<div class='col' style='text-align:right;background-color: #78b8df;'> " + inputValue + " bravo votre code est bon </div>";
} else {
  document.getElementById("valueInput").innerHTML ="<div class='col' style='text-align:right;background-color: #78b8df;'> " + inputValue + " votre code est mauvais </div>";
  }
	 }
0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
12 août 2022 à 20:18

Quel est la valeur de inputValue qui est affichée dans le message?

Es-tu certain qu'au moment où le message apparait, l'utilisateur a déjà encodé le code dans le champ, tenant compte du fait que le bouton "click me!" ne sert à rien?

1
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
13 août 2022 à 10:50

Même si comme on me l'as expliqué l'utilisateur pourrait voir les codes promo dans le code

Pour éviter cela, tu peux, dans le code JavaScript, faire un appel Ajax, envoyer le code à une page PHP, qui vérifie le code et te répond "ok" ou "bof".

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187 > yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024
13 août 2022 à 12:03

Bonjour yg_be

c'est gentil 

Mais je vais déjà assimiler tout cela 

Ce bon de commande n'est donne que si on me demande 

On verra plus tard comment faire 

Je vais digérer tout cela avant hihi

1
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557 > flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024
13 août 2022 à 12:11

Plus généralement, tout ce qui est fait en JavaScript peut facilement être modifié par l'utilisateur.

Tous ce qui est sensible ou important doit être fait en PHP.

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187 > yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024
13 août 2022 à 12:21

ah ok 

C'est vrai que je remarque que javascript c'est un langage magique et le lien que tu m'as donné est remplit d'exemple

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
12 août 2022 à 21:16

merci pour la réponse et l'aide

C'est super sympa

je suis occupé a réaliser diffèrent tests

Pour l'instant avant que l'utilisateur rentre quoi que ce soit 

il est bien affiché" le code est mauvais" ce qui est logique puisque c'est bien ma condition 

je devrais ajouter une condition en mentionnant que si la variable est vide on affiche rien 

Ensuite l'utilisateur entre un code il click sur le bouton

que le code entré  soit bon ou mauvais plus aucun message indiquant que le code est bon ou mauvais s'affiche juste 

la valeur de ce qu'il a entrer

apparaît a l'écran 

0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
12 août 2022 à 22:10

Tu n'as ni montré, ni expliqué, ce que tu avais modifié dans ton code javascript.  Je peux deviner ce que tu as fait, et il est préférable que tu m'en informes.  Je peux deviner que le bouton recopie le code encodé dans une zone vers une autre zone, ce qui est totalement stérile.

Il est nécessaire que tu expliques, du point de vue de l'utilisateur, pas du point de vue du programme, à quoi servirait ce nouveau bouton.

J'ai l'impression que tu souhaites que l'utilisateur puisse rentrer un code, et ensuite décider de déclencher un nouveau calcul, pour adapter un calcul qui a été fait avant.

De nouveau, sans une vue d'ensemble sur la globalité, que tu choisis de nous cacher, difficile de t'aider.

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 12 août 2022 à 22:55

Merci pour la reponse

voici donc le nouveau code adapte avec ce que tu m'as demandé de modifier 

var Livraison = 2;

// Comment affiche-t-on les prix du panier et du total
// Pour rappel, les prix des produits sont à modifier via les attributs HTML data-prix dans le fichier index.php
// 0 pour aficher aucune décimale : 19 euros
// 2 pour afficher deux décimales : 19.00 euros
var decimal = 2;

// Ne pas modifier la suite sauf si vous désirez modifier le code
var MonPanier = (function() {
	panier = [];
	
	function Item(nom, prix, quantite,url) {
		this.nom = nom;
		this.prix = prix;
		this.quantite = quantite;
		this.url = url;
			 //console.log(url);
		}

	function savepanier() {
		sessionStorage.setItem('MonPanier', JSON.stringify(panier));
	//	console.log(setItem);
	//	console.log(JSON.stringify(panier));
	//console.log(('MonPanier', JSON.stringify(panier)));
		//console.log(sessionStorage.setItem('MonPanier', JSON.stringify(panier)));
		
	}

	function loadpanier() {
		panier = JSON.parse(sessionStorage.getItem('MonPanier'));
	}
	
	if (sessionStorage.getItem("MonPanier") != null) {
		loadpanier();
	}

	var obj = {};

	obj.ajouter_produit_dans_panier = function(nom, prix, quantite,url) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				if(quantite)
				{
					panier[item].quantite = Number(quantite);
				}
				else 
				{
					panier[item].quantite ++;
				}
				savepanier();
				return;
				
			}
		}
		var item = new Item(nom, prix, quantite,url);
		//console.log(quantite);
		panier.push(item);
		savepanier();
	}

	obj.setquantiteForItem = function(nom, quantite) {
		for(var i in panier) {
			if (panier[i].nom === nom) {
				panier[i].quantite = quantite;
				break;
			}
		}
	};

	obj.enlever_produit_de_panier = function(nom) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				panier[item].quantite --;
				if(panier[item].quantite === 0) {
					panier.splice(item, 1);
				}
			break;
			}
		}
		savepanier();
	}

	obj.enlever_produit_de_panier_tous = function(nom) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				panier.splice(item, 1);
				break;
			}
		}
		savepanier();
	}

	obj.clearpanier = function() {
	    panier = [];
		savepanier();
	}

	obj.totalquantite = function() {
		var totalquantite = 0;
		for(var item in panier) {
			totalquantite += Number(panier[item].quantite);
	}
		return Number(totalquantite);
	}
//prix total panier
	obj.totalpanier = function() {
		var totalpanier = 0;
		for(var item in panier) {
			totalpanier += panier[item].prix * panier[item].quantite;
		}
	return Number(totalpanier.toFixed(decimal));
	}

	obj.listpanier = function() {
		var panierCopy = [];
		for(i in panier) {
			item = panier[i];
			itemCopy = {};
			for(p in item) {
				itemCopy[p] = item[p];
			}
			itemCopy.total = Number(item.prix * item.quantite).toFixed(decimal);
			panierCopy.push(itemCopy)
		}
	return panierCopy;
	}

	return obj;
})();

function changeQte(element){
	var qte = element.value;
	var t = $(element);
	var label = t.attr("aria-label");
    $("[data-nom='"+ label +"']").attr('data-qte', qte);
}


$('.ajouter-panier').click(function(event) {
	event.preventDefault(); 
	var nom_option = "";
	var prix_option = 0;
	var url= $(this).data('url');
	var option_checkbox = $(this).data('checkbox');
	if (option_checkbox != "") 
	{
		var checkboxes = document.getElementsByClassName(option_checkbox);
			for(var i = 0; i < checkboxes.length; i++) {
				if (checkboxes[i].checked == true) {
					var nom_option = nom_option + " (" + $(checkboxes[i]).data('nom') +")";
					var prix_option = prix_option + Number($(checkboxes[i]).data('prix'));
				}
			}
	}  
	if ($(this).data('select')) 
	{
		var nom = $(this).data('nom') + " (" + document.getElementById(""+$(this).data('select')+"").value + ")" + nom_option;
	}
	else var nom = $(this).data('nom');
	var prix = Number($(this).data('prix')) + (prix_option);
	if ($(this).attr('data-qte'))
	{
		var qte_option = $(this).attr('data-qte');
		MonPanier.ajouter_produit_dans_panier(nom, prix, qte_option,url);
	}
	else MonPanier.ajouter_produit_dans_panier(nom, prix, 1,url);
	afficherpanier();
});

$('.clear-panier').click(function() {
    MonPanier.clearpanier();
	afficherpanier();
});

$('.choix_livraison').click(function() {
	const cases = document.querySelectorAll('input[name="choix_livraison"]');
	for (const x of cases) {
		if (x.checked) {
		afficherpanier();
	}}
});

function afficherpanier() {
	var panierArray = MonPanier.listpanier();
	var output = "";
	 var countart=0;
    var countart2=0;
    var count=0;
	for(var i in panierArray) {
		output += "<div class='row' style='border-style: ridge;  border-width: 1px; border-color: #8ebf42; background-color: #d9d9d9;margin-bottom:5px;'>"
		+ "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'><button class='btn btn-danger effacer-item' data-nom='" + panierArray[i].nom + "'>X</button></div>"
		 + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + " <a class='example-image-link' href='"+ panierArray[i].url +"'data-lightbox='example-set'><img src=""""""  style='width:100px;height:100px;'></a>" + "</div>"
		  + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].nom + "</div>" 
		  + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].prix.toFixed(0) + "  euro</div>"
		  
		 + "<div class='form-inline col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'><div class='input-group'><button class='btn btn-primary moins-item' data-nom='" + panierArray[i].nom + "'>-</button>"
		 + "<input type='number' min='1' class='form-control item-quantite' style='width:55px !important' data-nom='" + panierArray[i].nom + "' value='" + panierArray[i].quantite + "'>"
			 
		 + "<button class='btn btn-primary plus-item' data-nom='" + panierArray[i].nom + "'>+</button></div></div>"
		  
		  + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].total + " euros</div>" 
       +  "</div>";
       count++;
       countart += panierArray[i].quantite;  // somme des unités d'articles
       countart2 = countart
       //console.log(panierArray[i].quantite );
       //console.log(countart );
       //console.log(panierArray[i].quantite );
	}
	$('.show-panier').html(output);

	if (Livraison == 2)
	
	{
	    	//test
  {
      let inputValue = document.getElementById("domTextElement").value; 
    }

	//test
		const cases = document.querySelectorAll('input[name="choix_livraison"]');
		for (const x of cases) {
			if (x.checked) {
				let nom_choix_livraison = x.dataset.nom;
				let prix_choix_livraison = x.value;
				let prix_et_livraison = (( (MonPanier.totalpanier()))) + Number(prix_choix_livraison)  ;
				//let test= ((( (MonPanier.totalpanier()))) + Number(prix_choix_livraison) ).toFixed(2);
let test= MonPanier.totalpanier();
document.getElementById('amount').value = prix_et_livraison ;

$('.total-panier').html(prix_et_livraison.toFixed(decimal));

document.getElementById('livraison-detail').innerHTML ="(" + nom_choix_livraison + ")" + prix_choix_livraison + " euro(s)";



document.getElementById('modal_erreur').innerHTML =nom_choix_livraison ;
document.getElementById('modal_erreur_mondial').innerHTML =nom_choix_livraison ;
document.getElementById('nouveau_prix_total_haut').innerHTML =((( (MonPanier.totalpanier()))) ) .toFixed(2) ;
document.getElementById("prix_depart_haut").innerHTML  = MonPanier.totalpanier(); 
document.getElementById("prix_depart").innerHTML  = MonPanier.totalpanier(); 
break;
			}
		}
	}
	
	$('.total-panier-modal').html(MonPanier.totalpanier());
	$('.total-quantite').html(MonPanier.totalquantite());
	if ((Qte_Minimum == 1) && (Math.sign(MonPanier.totalquantite() - Qte_Minimum_Valeur) == -1) && (MonPanier.totalquantite() != 0))
	{
		//document.getElementById('qte_minimum_report').innerHTML = txt_qte_minimum_bad;
	}
	else if ((Qte_Minimum == 1) && ((Math.sign(MonPanier.totalquantite() - Qte_Minimum_Valeur) == 1) || (Math.sign(MonPanier.totalquantite() - Qte_Minimum_Valeur) == 0)) && (MonPanier.totalquantite() != 0))
	{
		//document.getElementById('qte_minimum_report').innerHTML = txt_qte_minimum_ok;
	}
	else if (Qte_Minimum == 1)
	{
		//document.getElementById('qte_minimum_report').innerHTML = txt_qte_minimum_defaut;  
	}
	else if (Qte_Minimum == 0)
	{
		//document.getElementById('qte_minimum_report').innerHTML = "";
	} 
	//document.getElementById('total_qte_haut').innerHTML = MonPanier.totalquantite();
	document.getElementById('total_qte').innerHTML = MonPanier.totalquantite();
	document.getElementById('total_qte_bas').innerHTML = MonPanier.totalquantite();
	document.getElementById('total_qte_modal').innerHTML = MonPanier.totalquantite();
}

$('.show-panier').on("click", ".effacer-item", function(event) {
	var nom = $(this).data('nom')
	MonPanier.enlever_produit_de_panier_tous(nom);
	afficherpanier();
})

$('.show-panier').on("click", ".moins-item", function(event) {
	var nom = $(this).data('nom')
	MonPanier.enlever_produit_de_panier(nom);
	afficherpanier();
})

$('.show-panier').on("click", ".plus-item", function(event) {
	var nom = $(this).data('nom')
	MonPanier.ajouter_produit_dans_panier(nom);
	afficherpanier();
})

$('.show-panier').on("change", ".item-quantite", function(event) {
	var nom = $(this).data('nom');
	var quantite = Number($(this).val());
	MonPanier.setquantiteForItem(nom, quantite);
	afficherpanier();
});

function getValueInput()  {
      let inputValue = document.getElementById("domTextElement").value; 
      document.getElementById("valueInput").innerHTML = inputValue; 
    }
afficherpanier();

Je peux deviner que le bouton recopie le code encodé dans une zone vers une autre zone, ce qui est totalement stérile.

Mais il ne devrait plus voir son code encode dans une autre zone , cela me sers juste pour les tests

Par la suite cela sera remplace par mes conditions

si le code est bon j'indique que le code est bon et je fais le calcul 

si le code est mauvais je ne fais pas de calcul et j'informe l'utilisateur que le code est mauvais 

A quoi va servir ce bouton 

Comme expliqué ici plus haut je souhaite donner a certains utilisateurs un code promotionnelle qui serait valable de tel date a tel date 

Ou par exemple un code promo qui ne dure qu'un jour ...

ect....

J'informe par exemple une partie mes utilisateurs qu'un code promo est valable jusque demain soir ..."promo147"

une fois le code promo est rentré je le teste

si le code est bon , comme tu l'as deviné j'enclenche un nouveau calcul et j'affiche en html et un message signalant que le code est bon , avec un nouveau montant a payer

Si le code est mauvais pas de nouveau calcul et j'envois un message pour informer l'utilisateur que le code est mauvais 

Et comme on peux le voir dans le code tout les calculs se déclenchent dans la condition livraison 2

Si j e parviens a faire fonctionner ce code dans ma condition livraison 2 je suis sauvé

let inputValue = document.getElementById("domTextElement").value; 

car grâce a la variable je vais pouvoir effectuer mes conditions 

0
yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024 1 557
Modifié le 12 août 2022 à 23:16

Si tu souhaites que le bouton déclenche "si le code est bon , comme tu l'as deviné j'enclenche un nouveau calcul".

.

Alors:

  1. dans le programme du bouton, vérifie si le code est bon
  2. si il est bon, déclenche un nouveau calcul

.

Pour le moment, tu fais tout à l'envers:

  1. tu ne fais rien d'utile dans le programme du bouton
  2. tu vérifies si le code est bon au moment de faire le calcul

.

Cela résulte de ton incompréhension des principes de fonctionnement d'un programme javascript, et de ton ignorance du fonctionnement du code que tu utilises.

.

Je recommande fortement que tu continues plutôt sur un exemple plus simple, comme celui  que j'ai partagé en #2.  Tu peux le modifier, de façon à comprendre les principes de base.  Quand tu seras à l'aise, tu pourras appliquer tes connaissances sur ton programme complexe.  Sinon, tu vas continuer à faire des changements sans comprendre, donc sans apprendre ni progresser.

1
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
13 août 2022 à 00:44

Pfffff j'ai encore perdu un temps monstre

j'aurais du prendre ton exemple du post 2 (c'est la fatigue ...les gosses , le boulot )

j'avais trop la tête dans le guidon comme on dit

Ce sont les choses les plus simples que l'on ne voit pas 

Cela aurais été réglé depuis bien longtemps

Je vais mieux analyser cela demain 

Mais déjà un méga super grand merci ,tu es vraiment génial

Grace a toi j'ai encore épluché un peu plus ce code  

je pense que pour ce bon de commande cela est enfin fini

j'ai tout ce que je voulais ....

ne passe pas en resolu 

Je reviens demain confirmer

merci

merci

0
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
13 août 2022 à 12:04

Voila je confirme ce code fonctionne a merveille 

un super grand merci

0