Aide pour ma première modification importante

Résolu/Fermé
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - Modifié le 26 août 2022 à 15:05
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - 11 sept. 2022 à 12:32

bonjour tous 

il y a quelques jours j'étais confrontes a un soucis afin de pouvoir récupérer les quantités réel de mes articles 

car j'ai des articles uniques pour ceux la aucun soucis

Par contre j'ai des articles que j'appelle des packs 

donc ces packs comportent soit 10 ,20 ou 30 articles

au départ mon code n'est pas prévu pour compter ces packs 

donc le seul moyen que j'ai trouvé pour y parvenir  etait ce code

	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>";
		 
	//********************************************************************************
    //pour afficher les reductions on va compter le nombre de sachets reel***********
	//********************************************************************************		 
	   if (panierArray[i].nom == 77777) {
 //on incremente count de 10
count=count + (10 * Number(panierArray[i].quantite))
//console.log(count1);
} else if (panierArray[i].nom == 88888) {
  //on incremente count de 20
count=count + (20 * Number(panierArray[i].quantite))
//console.log(count2);
} else if (panierArray[i].nom == 99999) {
  //on incremente count de 20
count=count + (30 * Number(panierArray[i].quantite))
//console.log(ccount3);
}else {
count=count + (1 * Number(panierArray[i].quantite))
 //console.log(count);
}
//console.log(count);
var total_reel_avec_pack =count ;
//console.log(total_reel_avec_pack);

	}

nickel je récupère bien les quantités

Mais le soucis je ne sais pas les récupérer en temps réel

j'ai donc décider d'aller voir ou je pourrais modifier cela 

dans la function savepanier j'ai bien essayer ceci mais cela indiquait pour total réel avec pack valeur indefinie

	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)));
		document.getElementById("prints").innerHTML = MonPanier.totalpanier();
		//document.getElementById('total_quanditee').innerHTML = MonPanier.totalquantite();
		document.getElementById('total_quanditee').innerHTML = total_reel_avec_pack;
	}

En cherchant dans le code placé en fin de message j'ai trouve cette partie 

	obj.totalquantite = function() {
		var totalquantite = 0;
		for(var item in panier) {
			totalquantite += Number(panier[item].quantite);
			console.log(panier[item].quantite);
			console.log(Number(panier[item].quantite));
			
	}
		return Number(totalquantite);
	}

Ma console indique bien la bonne quantité choisie par article sauf pour les packs

donc j'ai  modifier le code de cette façon 

des avis ou des suggestions et surement des corrections

	obj.totalquantite = function() {
		var totalquantite = 0;
		for (var item in panier) {

			if (panier[item].nom == 77777) {
				totalquantite += 9
			} else if (panier[item].nom == 88888) {
				totalquantite += 19
			} else if (panier[item].nom == 99999) {
				totalquantite += 29
			}

			totalquantite += Number(panier[item].quantite);
		}
		return Number(totalquantite);
	}

cela fonctionnait nickel 

sauf que je voulais que ces quantités ne puissent apparaître que en temps a un seul endroit de ma page et pas partout

j'ai donc dupliquer l'objet totalquandite  pour en créer un autre otalquanditespecial

et cela fonctionne ...j'en reviens pas 

voici donc les modifications que j'ai effectue ajout de ce code 

	obj.totalquantitespeciale = function() {
		var totalquantitespeciale = 0;
		for (var item in panier) {

			if (panier[item].nom == 77777) {
				totalquantitespeciale += 9
			} else if (panier[item].nom == 88888) {
				totalquantitespeciale += 19
			} else if (panier[item].nom == 99999) {
				totalquantitespeciale += 29
			}

			totalquantitespeciale += Number(panier[item].quantite);
		}
		return Number(totalquantitespeciale);
	}

et modification de savepanier en 

	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)));
		document.getElementById("prints").innerHTML = MonPanier.totalpanier();
		//document.getElementById('total_quanditee').innerHTML = MonPanier.totalquantite();
		//document.getElementById('total_quanditee').innerHTML = total_reel_avec_pack;
		document.getElementById('total_quanditee').innerHTML =MonPanier.totalquantitespeciale();
		
	}


 

voici l'ancien code 

donc l'aide est juste pour savoir malgré que cela fonctionne si tout est bien fait 

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)));
		document.getElementById("prints").innerHTML = MonPanier.totalpanier();
		//document.getElementById('total_quanditee').innerHTML = MonPanier.totalquantite();
		document.getElementById('total_quanditee').innerHTML = total_reel_avec_pack;
		
		
	}

	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);
	}

	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);
	//	let data_qte =  document.querySelector("[data-nom='"+ label +"']");
    //	data_qte.removeAttribute("data-qte");
    //	data_qte.setAttribute("data-qte", ""+qte+"");
	//var qte = element.value;
	//var t = $(element);
	//var label = t.attr("aria-label");
	//let data_qte =  document.querySelector("[data-nom='"+ label +"']");
	//data_qte.removeAttribute("data-qte");
	//data_qte.setAttribute("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();
	}}
});

//*******************************
//debut fonction panier**********
//*******************************
function afficherpanier() {
    
	//********************************************************
    //debut on ajoute les lignes dans le bon de commande ***********
	//********************************************************
	var panierArray = MonPanier.listpanier();
	var output = "";
	 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>";
		 
	//********************************************************************************
    //pour afficher les reductions on va compter le nombre de sachets reel***********
	//********************************************************************************		 
	   if (panierArray[i].nom == 77777) {
 //on incremente count de 10
count=count + (10 * Number(panierArray[i].quantite))
//console.log(count1);
} else if (panierArray[i].nom == 88888) {
  //on incremente count de 20
count=count + (20 * Number(panierArray[i].quantite))
//console.log(count2);
} else if (panierArray[i].nom == 99999) {
  //on incremente count de 20
count=count + (30 * Number(panierArray[i].quantite))
//console.log(ccount3);
}else {
count=count + (1 * Number(panierArray[i].quantite))
 //console.log(count);
}
//console.log(count);
var total_reel_avec_pack =count ;
//console.log(total_reel_avec_pack);

	}
A voir également:

12 réponses

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

je continue a faire des essais ....

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

avec les articles par unités cela fonctionne mais pas avec les packs

cela me donne de mauvais résultats

par exemple pour un pack j'ai bien 30 

Mais si j'ajoute un deuxième pack de 30 je n'ai que 32 et un troisième pack j'ai 33

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

j'ai essaye de placer des console.log ici

mais rien n'est retourné

	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);
							console.log(Number(quantite));
			console.log(Number(panier[item].quantite));
			console.log(quantite);
			console.log((panier[item]));
				}
				else 
				{
					panier[item].quantite ++;
					console.log(panier[item].quantite);
				}
				savepanier();
				return;
				
			}
		}
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
26 août 2022 à 16:52

Prends le temps de faire des console.log() utiles et lisibles.

Pose-toi la question: "à quoi sert le console.log()".  Quel est le texte qui serait utile de voir apparaitre dans la console?

Pour moi, afficher un nombre, comme tu fais, c'est très peu utile.  Je préfèrerais voir dans la console des informations comme:

  • le code est rentré dans la fonction abc
  • la variable xyz a comme valeur 1234
  • le code exécute la première condition du if "hhh"
  • ...

Qu'en penses-tu?

0
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
26 août 2022 à 16:44

bonjour,

Pour l'exemple qui ne donne pas le bon résultat, partage à nouveau le code concerné, avec des annotations.

Indique, ligne par ligne, si la ligne est exécutée, et la valeur de chaque variable concernée.

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

Bonjour yg_be

on parle bien de ce code 

	obj.totalquantitespeciale = function() {
		var totalquantitespeciale = 0;
		for (var item in panier) {

			if (panier[item].nom == 77777) {
				totalquantitespeciale += 9
				console.log("story " + totalquantitespeciale + " 77777");
			} else if (panier[item].nom == 88888) {
				totalquantitespeciale += 19
				console.log("story " + totalquantitespeciale + " 88888");
			} else if (panier[item].nom == 99999) {
				totalquantitespeciale += 29
				console.log("story " + totalquantitespeciale + " 99999");
			}

			totalquantitespeciale += Number(panier[item].quantite);
		}
		return Number(totalquantitespeciale);
	}
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
26 août 2022 à 17:14

Penses-tu que c'est ce code qui ne te donne pas le résultat attendu?

0

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 26 août 2022 à 17:03

Merci pour l'aide

c'est vrai que cela serait bien plus utile , mais faut savoir comment bien placer ces log et cela c'est une autre histoire 

de toute façon et a première vue cela ne peux se passer que dans 3 functions  

que voici

	obj.totalquantitespeciale = function() {
		var totalquantitespeciale = 0;
		for (var item in panier) {

			if (panier[item].nom == 77777) {
				totalquantitespeciale += 9
				console.log("story " + totalquantitespeciale + " 77777");
			} else if (panier[item].nom == 88888) {
				totalquantitespeciale += 19
				console.log("story " + totalquantitespeciale + " 88888");
			} else if (panier[item].nom == 99999) {
				totalquantitespeciale += 29
				console.log("story " + totalquantitespeciale + " 99999");
			}

			totalquantitespeciale += Number(panier[item].quantite);
		}
		return Number(totalquantitespeciale);
	}


	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.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;
				
			}
		}
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
26 août 2022 à 17:15

Ce n'est pas une autre histoire, c'est l'histoire de ta sortie de la pensée magique, de ton chemin vers la compréhension.

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

non bien sur 

c 'est ce code 

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

car si je fais ceci 

j'ai bien la quantité des articles mais pas des packs

document.getElementById('total_quanditee').innerHTML = MonPanier.totalquantite ();
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
26 août 2022 à 17:49

Donc tu penses que le code en #6 est correct?

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
26 août 2022 à 17:51

Evite de faire des extraits de code de quelques lignes.

N'hésite pas à utiliser les n° de lignes pour faire référence à du code.

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

non puisque cela ne fonctionne pas ...

je dois surement venir bouger dans le code du #10

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
26 août 2022 à 19:46

Choisis un code qui te semble suspect, tu vas ensuite travailler pour vérifier son comportement.

Au lieu de partager des petits morceaux de code, partage l'ensemble, et fais ensuite référence aux n° de lignes dans cet ensemble.

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
26 août 2022 à 21:38

Merci pour la reponse

je viens de mettre en œuvre ce que tu viens d'expliquer je présente tout d'abord le code en entier (du moins la partie qui nous intéresse

bon je ne sais pas si je vais bien m'expliquer 
Mais je vais essayer 

dans mon bon de commande il y a deux moyens de modifier la quanditee d'un objet soit en selectionnant directement sa nouvelle quanditee qui est mise a jour
soit un peuplus bas dans un tableau reacpitulatif avec un + et un - a gauche et droite de chaque article

Lorsque j'ajoute un nouvel article avec une quanditee directement 

la ligne 61 le cree
et l'ajoute dans la ligne 140

A present que l'article existe si je modifie sa quanditee en plus avec les boutons + du tablau recapitulatif
la ligne 50 met a jour la quanditee
et remets la ligne 140 a jour
si je modife la quanditee avec le bouton -
c'est la ligne la ligne 63 qui remet a jour la quanditee
et remets la ligne 140 a jour

si je modifie la quanditee directement en modifiant la quanditee de l'objet a ce moment 
a ce moment c'est la ligne  41 qui mets la quanditee a jour
et bien evidement le total de la ligne 140 est mis a jour 

donc il faudrait modifier l'objet obj.ajouter_produit_dans_panier  et obj.enlever_produit_de_panier 

j'ai essayer d'utiliser la variable total_reel_avec_pack qui est cree a la ligne 202 mais il me dit qu'elle n'est pas definie

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)));
		document.getElementById("prints").innerHTML = MonPanier.totalpanier();
		//document.getElementById('total_quanditee').innerHTML = MonPanier.totalquantite();
		//document.getElementById('total_quanditee').innerHTML = total_reel_avec_pack;
		//document.getElementById('total_quanditee').innerHTML =MonPanier.totalquantitespeciale();
		//ce code n'affiche que les articles dans le panier flottant 
		//document.getElementById('total_quanditee').innerHTML = MonPanier.totalquantite ();
		
	}

	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)
				{
					//si il y a deja une quanditee elle est remise a jour
					panier[item].quantite = Number(quantite);
					console.log("story " + quantite + " obj.ajouter_produit_");
				
				
				}
				else 
				{
					//cela sert a ajouter l'article grace au bouton + du tableau recapitulatif
					//une nouvelle quanditee est cree
					panier[item].quantite ++;
						console.log("story " + panier[item].quantite + " obj.ajouter_");
				
				}
				
				savepanier();
				return;
				
			}
		}
		//dans le cas d'un nouvel article 
		var item = new Item(nom, prix, quantite,url);
			console.log("story " + quantite + " obj.ajouter_produit_dans_panier");
				
				panier.push(item);
		savepanier();
	}

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

	obj.enlever_produit_de_panier = function(nom) {
		for(var item in panier) {
			 if(panier[item].nom === nom) {
				panier[item].quantite --;
				//il affiche la nouvelle quanditee de l'article
				console.log("story " + panier[item].quantite + " obj.enlever_produit_de_panier");
				//si article a 0 il supprime la ligne 
				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.totalquantitespeciale = function() {
		//on initialise la variable a 0
		//var totalquantitespeciale = 0;
		//on cree une boucle des articles dans le panier
		//for (var item in panier) {
// si l'article dans le panier porte le nom 77777 alors le totalquantitespeciale +9
			//if (panier[item].nom == 77777) {
				//totalquantitespeciale += 9
				//console.log("story " + totalquantitespeciale + " 77777");
				// si l'article dans le panier porte le nom 88888 alors le totalquantitespeciale +19
			//} else if (panier[item].nom == 88888) {
				//totalquantitespeciale += 19
				//console.log("story " + totalquantitespeciale + " 88888");
				// si l'article dans le panier porte le nom 99999 alors le totalquantitespeciale +9
			//} else if (panier[item].nom == 99999) {
				//totalquantitespeciale += 29
				//console.log("story " + totalquantitespeciale + " 99999");
			//}
//autrement on ajoute 1 aux autres articles
			//totalquantitespeciale += Number(panier[item].quantite);
		//}
		//return Number(totalquantitespeciale);
	//}
	
	//ce code ajoute la nouvelle quanditee a la quanditee existante  ci qui donne la quanditee totale 
	obj.totalquantite = function() {
		var totalquantite = 0;
		for(var item in panier) {
			totalquantite += Number(panier[item].quantite);
			console.log("story  debut total");
	console.log("story " + item + " item");
	console.log("story " + totalquantite + " total");
	console.log("fin total");
	}
		return Number(totalquantite);
	}

	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);
	//	let data_qte =  document.querySelector("[data-nom='"+ label +"']");
    //	data_qte.removeAttribute("data-qte");
    //	data_qte.setAttribute("data-qte", ""+qte+"");
	//var qte = element.value;
	//var t = $(element);
	//var label = t.attr("aria-label");
	//let data_qte =  document.querySelector("[data-nom='"+ label +"']");
	//data_qte.removeAttribute("data-qte");
	//data_qte.setAttribute("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();
	}}
});

//*******************************
//debut fonction panier**********
//*******************************
function afficherpanier() {
    
	//********************************************************
    //debut on ajoute les lignes dans le bon de commande ***********
	//********************************************************
	var panierArray = MonPanier.listpanier();
	var output = "";
	 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>";
		 
	//********************************************************************************
    //pour afficher les reductions on va compter le nombre de sachets reel***********
	//********************************************************************************		 
	   if (panierArray[i].nom == 77777) {
 //on incremente count de 10
count=count + (10 * Number(panierArray[i].quantite))
//console.log(count1);
} else if (panierArray[i].nom == 88888) {
  //on incremente count de 20
count=count + (20 * Number(panierArray[i].quantite))
//console.log(count2);
} else if (panierArray[i].nom == 99999) {
  //on incremente count de 20
count=count + (30 * Number(panierArray[i].quantite))
//console.log(ccount3);
}else {
count=count + (1 * Number(panierArray[i].quantite))
 //console.log(count);
}
//console.log(count);
var total_reel_avec_pack =count ;
//console.log(total_reel_avec_pack);

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

je viens de regarder l'objet function 

ajouter produit dans panier  

je pense parvenir a lui donner une quanditee quand l'article existe deja 

par contre je ne vois pas comment faire quand il n'existe pas 

voici mon code 

	obj.ajouter_produit_dans_panier = function(nom, prix, quantite,url) {
		for(var item in panier) {
			if(panier[item].nom === nom) {
				if(quantite)
				{
					//si il y a deja une quanditee elle est remise a jour
					panier[item].quantite = Number(quantite);
					console.log("story " + quantite + " obj.ajouter_produit_");
				
				
				}
				else 
				{
					//cela sert a ajouter l'article grace au bouton + du tableau recapitulatif
					//une nouvelle quanditee est cree
					panier[item].quantite ++;
						console.log("story " + panier[item].quantite + " obj.ajouter_");
				
				}
				
				savepanier();
				return;
				////si le nom de l'article est 77777
			}			else if(panier[item].nom === 77777) {
				if(quantite)
				{
					//si il y a deja une quanditee elle est remise a jour
					panier[item].quantite = (Number(quantite)+ 9);
					console.log("story " + quantite + " obj.ajouter_produit_");
				
				
				}
				else 
				{
					//cela sert a ajouter l'article grace au bouton + du tableau recapitulatif
					//une nouvelle quanditee est cree
					panier[item].quantite ++;
						console.log("story " + panier[item].quantite + " obj.ajouter_");
				
				}
				
				savepanier();
				return;
				
			}
			
		}
		//dans le cas d'un nouvel article mais comment faire pour l'article 77777
		
		var item = new Item(nom, prix, quantite,url);
			console.log("story " + quantite + " obj.ajouter_produit_dans_panier");
				
				panier.push(item);
		savepanier();
	}
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
27 août 2022 à 09:50

Eh bien, utilisons maintenant la console pour comprendre le comportement de ton code.

Fais un test, partage ce qui est affiché dans la console, et explique si cela semble correspondre à ce que tu attends.

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

bonjour  yg_be

après une bonne nuit de sommeil

je contrôle mais il ne prends pas en compte ma nouvelle condition pfffff 

Merci pour l'aide

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

avec ce code cela fonctionne 

sauf pour l'incrémentation et bien entendu juste pour un pack

	obj.ajouter_produit_dans_panier = function(nom, prix, quantite,url) {
		for(var item in panier) {
			if(panier[item].nom === 77777) {
				if(quantite)
				{
					//si il y a deja une quanditee elle est remise a jour
					panier[item].quantite = (Number(quantite)* 10);
					console.log("story " + quantite + " obj.ajouter_produit_");
				}
				else 
				{
					//cela sert a ajouter l'article grace au bouton + du tableau recapitulatif
					//une nouvelle quanditee est cree
					var i=10 ;
					panier[item].quantite ++i ;
						console.log("story " + panier[item].quantite + " obj.ajouter_");
				}
				
				savepanier();
				return;
			}
			
		}
		//dans le cas d'un nouvel article 
		
		var item = new Item(nom, prix, 10,url);
			console.log("story " + quantite + " obj.ajouter_produit_dans_panier");
				
				panier.push(item);
		savepanier();
	}
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
27 août 2022 à 20:44

Je dois avouer que je suis assez perplexe.  J'ai la perception que tu crées du code au hasard, sans avoir réellement compris le problème à résoudre, et sans maitriser les bases de la logique ni de la programmation.

Nous t'avons souvent suggéré des solutions toutes faites, et je pense que cela ne t'aide pas à progresser.  Tu les utilises, sans les comprendre.

Je pense que tu es face à un choix: soit tu développes ton site en faisant appel à quelqu'un de compétent (et ce n'est pas notre rôle), soit tu te formes, en laissant provisoirement le site sur le côté.

Je me demande si tu ne progresserais pas mieux en commençant par maitriser les concepts de base.  A tout hasard, je suggère que tu commences par les entrainements proposés par concours.castor-informatique.fr.

1
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
29 août 2022 à 21:16

Bonjour Yg_be

Si tu savais , mais si seulement si tu savais les nuits blanches que j'ai deja passe avec ces codes a chercher

oui je sais j'aurais du apprendre ces langages plutot que de chercher dans el vent

Mais au début on ne se rends pas compte que cela demande autant de connaissance 

Concernant mon site je suis enfin arrive au bon de ce que je voulais et pour l'instant je vais laisser un bouton réaliser les calculs , on verra plus tard

Merci pour le lien je vais aller voir 

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
29 août 2022 à 22:21

Je respecte ton approche.
J'en suggère une autre, qui, je pense, te permettra d'aller plus loin.
Je ne souhaite certainement pas dévaloriser ni tes efforts, ni le résultat que tu as obtenu.
Bonne continuation!

1
flexi2202 > yg_be Messages postés 23405 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 20 décembre 2024
31 août 2022 à 08:04

Merci yg_be

on continuera a faire des efforts

bonne semaine 

0

Salut, voici un bon exemple de conception mal faite et en tout cas de tout ce qu'il faut éviter de faire.

Le "code" ne doit jamais pallier à une conception hasardeuse et non adéquate. Un programme doit être le reflet du besoin exprimée et non l'inverse.

Ici si la question est de compter des articles ou des packs cela doit être pris en compte dès la conception par le système d'information, avant décrire une quelconque ligne de programme.

Donc d'où viennent les informations des articles et packs existants? Ce n'est pas une question auquel un ordinateur peut répondre mais seul un humain peut le faire et la réponse peut être différente pour chaque système d'information.

En général c'est une base de données, seule méthode qui permet à un programme(web ou pas) de durer dans le temps en pouvant être modifiable si bien conçue à la base.

Remarquez aussi que si vous faites ces calculs dans JavaScript côté client( nombre d'articles, nombre de pack, coût total...) ceci n'ont aucune sécurité et à peu près n'importe qui connaissant un peu de JavaScript peut facilement mettre le prix qu'il veut donc aucune sécurité de ce côté là. Certes il sera toujours nécessaire de vérifier par la suite côté serveur si les montants/tarifs/articles ont des valeurs possibles mais cela empêche déjà une faille de sécurité côté client et pour ça il doit être nécessaire de pouvoir comparer avec des valeurs qui ne peuvent pas être accessible directement par l'utilisateur; çàd. sur une base de données.

Voilà un problème important de votre conception. Aucun calcul JavaScript(sauf avec node.js qui fonctionne sur serveur mais comme ce n'est pas expliqué et que vous êtes sur le DOM je suppose que ce n'est pas le cas) n'est sécurisé et ne doit être fait sauf de manière très indicative car sans garantie de sécurité ou même d'erreur.

N'importe quel système de gestion d'informations/données doit mettre les données/informations au centre, ne pas le faire à de nombreux désavantages et ne permet pas de faire un programme fonctionnel, impliquera une complexité accrue et inutile.

Logiquement donc si vous voulez compter une quantité renseignée par l'utilisateur c'est dans le traitement du formulaire qu'il faut le faire. Si cette quantité est fournie à l'utilisateur celle ci doit être stockée quelque part dans le système d'information = la base de données relationnelle et sa structure logique qui permet de mettre en avant les relations possibles et existantes d'une réalité exprimée.

Exemple: une commande d'un nombre d'articles supérieurs au nombre en stock peut être générée ce qui n'est forcément pas correct et sera contradictoire avec les lois car vous vendez des choses qui 'existent pas. Ce sera préjudiciable aussi bien à l'acheteur potentiel qui sera déçu dans sa demande (et évitera le site/service proposé à l'avenir) aussi bien que le prestataire qui aura un logiciel de gestion inapte à tenir compte de ses réalités.

Ce n'est qu'un exemple trivial pour indiquer l'importance de votre conception, penser avant de créer, définir les plans et l'organisation et pas faire les choses au petit bonheur la chance sans tenir compte des réalités du terrain = analyser le système d'informations et le retranscrire en programme.

Ici si vous indiquez dans votre système d'informations qu'un pack est un regroupement d'articles vous vous économisez énormément de complexité et risque potentiel d'erreurs.

Un pack sera enregistré avec un nom (ou plutôt un identifiant) dans une base de données, il indique la composition et nombre des articles.

Donc pour compter aussi bien les articles et leur nombres, le prix il suffit de regarder le pack.

Côté client la seule information nécessaire à fournir est l'identifiant(ou nom) du pack et de détailler celui ci sur la forme voulue en récupérant les données sur la base.

Si l'on veut compter le nombre de packs que choisit un utilisateur il suffit d'enregistrer un nombre en rapport avec le nom/identifiant du pack. Et on peut avoir toutes les autres informations nécessaires, pas besoin de faire des boucles mais :

pack identifié "numéro1" quantité =2 indique clairement le prix , la composition du pack et le nombres d'article du pack.

L'autre avantage important est nécessaire(ne pas le faire consisterais à se tirer aussi bien une balle dans le pied mais aussi dans les deux genoux, dur de marcher dans ces conditions) est de pouvoir changer à tout moment dans la base de données la composition et le tarif d'un pack. Sans ça, si vous utilisez les informations(de manière beaucoup plus complexes et foireuse) directement dans le code de la page (côté client) pour faire la moindre modif vous devez changer tout le code de la page.

L'informatique est faite pour se simplifier la vie, notamment en automatisant des concepts humains. Si cela n'est pas fait vous aboutissez sur quelque chose qui est plus complexe que d'avoir à gérer des armoires de données sur du papier alors autant utiliser des armoires avec des bulletins à trier et classer, ou à minima vous obtenez un programme inefficace et propice aux erreurs qui devient vite ingérable =inutilisable.

Donc avant toute maçonnerie c'est mieux d'avoir fait des plans parce que si votre mur ne fait pas les bonnes dimensions il sera inutile et risque de pas tenir droit. Pour un programme les "dimensions" ce sont les données que vous avez à gérer et les raisons et particularités de ces données

Exemple: un article à un prix, des promotions possible, un colori, etc(etc regroupant toute la réalité des besoins)... un pack peut regrouper plusieurs articles. Si vous avez ceci pris en compte pas besoin de vous casser la tête avec des rustines de bout de  "code" qui seront autant de possibilité de pannes et fuites(pour les données cela veut dire une information fausse ou impossible) qui demandent de faire du travail en plus que si vous pensez correctement le système.

Ce que je veut dire c'est que la programmation est la finalité d'une analyse et conception. Sans cela autant ne rien faire car vous aurez un résultat horrible et non fonctionnel qui demande plus de temps de travail et de ressources pour le créer et le faire fonctionner que si ça réponds à la logique métier, les besoins particuliers nécessaires qui sont la base et le centre en GED(gestion électronique de documents).

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

bonjour

Merci pour toutes ces explications 

avant toute chose chose je ne suis ni un concepteur , ni un programmeur ,ni quoi que ce soit dans ce domaine 

Voici ma petite histoire pour que tout le monde puisse la comprendre 

je suis pêcheur en hobby , je pratique la pêche a la perle et sans rien connaître j'ai commencé a réaliser un blog avec blogger 

Je fabrique des esches artificiel de manière sporadique pas question de faire cela a grande échelle cela me prendrais trop temps  ...

donc j'ai réalisé avec l'aide de l'une ou l'autre personne et sans rien connaître en conception 

Un premier bon de commande qui n'a jamais réellement fonctionner 

Ensuite j'ai laisser tomber l'histoire durant 7 ans 

il y a je pense +- 1an 1/2  j'ai voulu créer un site pour remplacer blogger , sans chercher plus loin , je suis tombé sur boostrap et cgnie et j'ai commencé a créer mon premier site  qui devait au tout début rester dans la plus grande simplicité quelques articles ect...(je ne connaissais pas wordpress ....)

quelques mois après , je suis tombé sur un site de pêche qui proposais aux membres de poster leurs propres sortie de pêche 

Donc j'ai du me lancer dans les bases de données , le php , le html sans avoir aucune formation afin de pouvoir réaliser la même chose 

Je ne m attendais pas a ce que cela demande autant de connaissance en conception et de temps surtout

Et heureusement que j'ai eu jordane et yg_be entre autre (que je remercie du fond du coeur)

Autrement je serais toujours occupé a chercher 

J'ai appris énormément de choses grâce a comment ca marche , mais bon quand on a aucune formation c'est très dur de s'en sortir surtout lorsque on approche la soixantaine 

Surtout de démarrer de 0

bon alors on va me dire pourquoi tu n'as pas suivi de formation pour apprendre 

La réponse est toute simple 

Pourquoi devoir apprendre le html , le css , le php , le javascript en totalité pour un seul et unique site 

Pour l'instant je parviens a me débrouiller avec des choses banales et basique et j'en suis super heureux 

Mais malheureusement je n'ai pas le temps pour étudier tous ces langages 

Je ne savais même pas ce que cela était un echo... au tout début 

Une fois ce fameux site termine encore une fois grâce a la communauté ...

J'ai cherche après un bon de commande  pour remplacer celui qui n'a jamais voulu fonctionner 

après des semaines de recherche je suis tombé sur celui que j'utilise actuellement 

Puis au fil des jours et des semaines , j'ai voulu ajouter des fonctionnalité 

Avec le peux de connaissance que j'ai ,et enfin je suis presque arrivé a ce que je voulais faire 

je pense qu'ave du recul j'aurais pris wordpress et woocommerce , cela était plus fait pour moi 

C'est vrai que l'histoire de la base de donnée pour gérer les articles ,les packs ect est une très bonne idée et cela sera surement ou peut être une prochaine étape

concevoir un code en pensant a tout tout être très compliqué , je le vois bien avec ce bon de commande dans lequel j'ajoute toujours des choses qui au départ je n'y avais pas pensé   

Si j'ai raconte tout cela c'était juste pour éviter de répondre juste un merci 

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

bonjour a tous 

je tenais juste a informer que j'ai par trouver 

donc cela était bien a ce niveau  

	obj.totalquantite = function() {
		var totalquantite = 0;
		for(var item in panier) {
		  if(panier[item].nom === 77777){
 	totalquantite += Number(panier[item].quantite)*9;
		console.log(totalquantite);
} 

		    
			totalquantite += Number(panier[item].quantite);
			//console.log(totalquantite);
	}
	console.log(totalquantite);
		return Number(totalquantite);
	}



	for(var i in panierArray) {
	    
	    if (panierArray[i].nom == 77777) {
	        console.log("777777777777")
  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="+ panierArray[i].url + "  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)*10) + "'>"
		 + "<button class='btn btn-primary plus-item' data-nom='" + panierArray[i].nom + "'>+</button></div><br>attention CE PACK COMPORTE "  + ((panierArray[i].quantite)*10) + " SACHETS INDIVISIBLE</div>"
	     + "<div class='col' style='text-align: center;border-left: solid;padding-left: 5px;padding-right: 5px;'>" + panierArray[i].total + " euros</div>" 
         +  "</div>";
} 
	    else if (panierArray[i].nom != 77777) {
	    console.log("different")
		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="+ panierArray[i].url + "  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>";
         console.log(panierArray[i].nom);
	    } 
0