1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
| <script>
var catalogue= new Array(); // on créé un tableau catalogue
catalogue.push(new Produit(1, "ref 1", "ordinateur", 800));// je remplis le tableau catalogue avec push() qui ajoute un ou plusieurs éléments à la fin d'un tableau et retourne la nouvelle taille du tableau.
catalogue.push(new Produit(2, "ref 2","souris", 20.45));
catalogue.push(new Produit(3, "ref 3","uniter centrale", 620));
catalogue.push(new Produit(4, "ref 4","ecran", 120));
catalogue.forEach(function (item, index, array) {
// console.log(item, index);
});
function Produit(id, reference, designation, prix) {
this.id_produit= id; // la je dit que id_produit à pour valeur id
this.ref_produit= reference;
this.prix_produit= prix;
this.designation_produit= designation;
}
function remplirCatalogue() {
var cat= document.getElementById('cat'); //je récupère la balise div ou id=cat
for (var i in catalogue) {
var e= document.createElement("p");// crée un nouvel élément p
e.value=i;//la variable e prend tour à tour les valeurs de i
var txt= document.createTextNode(catalogue[i].id_produit + " " + catalogue[i].ref_produit + " " + catalogue[i].designation_produit + " " + catalogue[i].prix_produit);// on met le contenu dans la balise p
var txt2=document.createElement("input");// crée un nouvel élément input
txt2.setAttribute("type", "number");// on donne le type à l'input
txt2.setAttribute("name", catalogue[i].id_produit+"");//je donne le nom à chaque input
txt2.setAttribute("placeholder", 0);
txt2.setAttribute("id", catalogue[i].id_produit+"");
cat.appendChild(e);//je place la balise div dans mon doc
e.appendChild(txt);//je place les balises p dans mon div
e.appendChild(txt2);//je place les balises input dans mon div
}
}
remplirCatalogue();
function CalculPanier(produit, Nbr_article) {
var id = produit.id;
//id=id.replace("_numproduit","") // ici on enlève le texte inutile, on veut récupéré que le chiffre pour trouver dans ton catalogue le produit concerné
// replace( searchValue , replaceValue)
var nbr1 = produit.value; //ici la variable nbr1 récupère le nombre de produit
//var Prix_article = produit.prix_produit;
var Prix_article = Number(catalogue[id].prix_produit);
var Prix_article = catalogue.find(item => item.prix_produit == id);
var total = (Number(nbr1) * Number(Prix_article)); //ici je calcule le nombre par le prix
//document.getElementById("totalarticle").innerHTML = total; //ici j'affiche la valeure de la variable total dans le span qui a pour id totalarticle
alert(id);
alert(Nbr_article);
alert(Prix_article);
}
var inputs= new Array();
for (var ListeId in catalogue) {
inputs.push(document.getElementById(catalogue[ListeId].id_produit+""));//je liste l'id de chaque input
document.getElementById(catalogue[ListeId].id_produit+"");
}
inputs.forEach((produit) => {
produit.addEventListener("change", (e) => {
var Nbr_article = produit.value;
CalculPanier(produit, Nbr_article);
});
});
</script> |
