Bonjour tout le monde!
Je suis entrain de travailler sur une application au niveau de ma réalisation et je suis bloqué sur un script pendant 2 jours et j'avoue que je ne suis pas bon en javascript.
Je suis entrain de travailler sur un formulaire de saisie de devis qui laisse la possibilité d'ajouter autant des champs de saisie dynamiquement que l'on veut et supprimer quand on le souhaite, à ce niveau tout est parfait.
Ensuite, à la saisie de quantité et prix_unitaire, on doit avoir le montant calculé directement. du coup pour la premiere ligne ça marche, il effectue les calcules mais les autres champs ne marche pas.
j'ai ci-joint mon fichier qui contient le script que j'ai aussi documenté.
Merci
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118 <html> <body onload="Create_Ligne();"> <table id="fact-tablee" style="width:507px;margin-top:10px;" cellpadding="0" cellspacing="0"> <tr> <th class="corn-fact-t-l"></th> <th class="fact-heade" style="width:166px;">DESIGNATION</th> <th class="fact-heade" style="width:58px;">Qté</th> <th class="fact-heade" style="width:82px;">P.U.</th> <th class="fact-heade" style="width:38px;">TVA</th> <th class="fact-heade" style="width:60px;">PRIX HT</th> <th class="fact-heade" style="width:59px;">PRIX TTC</th> <th class="fact-heade" style="width:30px;"></th> <th class="corn-fact-t-r"></th> </tr> </table> <table> <tr> <th><input type="button" onclick="Create_Ligne();" value="Ajouter" /> </th> </tr> </table> <script language="javascript"> //--------------- function Calcul(){ var Ind=1, Obj = null, Qte, Prix, Total = 0, Valeur; //-- tant que l'objet existe while( Obj = document.getElementById('qte')){ //-- recup des valeurs Qte = parseInt( Obj.value); Prix = parseFloat( document.getElementById('pu').value); Valeur = Qte * Prix; // pas mis les tests si isNaN //-- affiche le resultat document.getElementById('montant').value = Valeur; //-- ajoute dans total Total += Valeur; //-- au suivant Ind ++; } //-- mets dans total // document.getElementById( "total").value = Total; } var Compteur = 0; //-------------------------- function Delete_Ligne( obj_){ var Parent; var Obj = obj_; if( Obj){ //-- tant que pas la balise <TR> do{ Obj = Obj.parentNode; }while( Obj.tagName != "TR") //-- Recup du parent Parent = Obj.parentNode; //-- Suppression de la ligne if( Parent){ Parent.deleteRow( Obj.rowIndex) } } } //---------------------- function Create_Ligne(i){ //-- compteur pour le FUN Compteur++; //-- Get objet tableau var O_Table = document.getElementById('fact-tablee'); //-- Get nombre de ligne du tableau var NbrLigne = O_Table.rows.length; //-- Position d'insertion var Pos = NbrLigne; //-- Insertion d'une ligne O_Row = O_Table.insertRow( Pos); //-- Insertion des cellules O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = O_Row.rowIndex; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div align="center"><input type="text" name="designation[]" class="inp-design" value="designation n°' +Compteur +'"/></div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div class="border" style="text-align:center;"><input type="text" id="qte" name="qte[]" class="inp-qte" onKeyUp="Calcul()" /></div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div class="border" style="text-align:center;"><input type="text" id="pu" name="pu[]" class="inp-pu" onKeyUp="Calcul()"/></div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"> 0</div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = ' <div class="border" style="text-align:center;height:18px;"> <input type="text" id="montant" name="montant[]" class="inp-pu" /></div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;">0 </div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"><input type="image" src="images/cross.png" onClick="Delete_Ligne(this)" /></div><div class="separateur"> </div>'; O_Cell = O_Row.insertCell(-1); O_Cell.innerHTML = '<div class="fact-b-r"></div>'; } </script> </body> </html>
Partager