Somme Tableau Formulaire

Bonjour,

j'ai besoin d'un sérieux coup de main car j'ai pas mal de lacune en Javascript.
J'ai réalisé un formulaire qui se présente sous la forme d'un tableau.

Le tableau est constitué :
une colonne article,
une colonne quantite,
une colonne PU
et une colonne Prix.

Mon but est de calculer la somme de tous les prix et de présenter cette somme dans un champ total. J'aimerais faire cela en Javascript.

J'ai réalisé un script php qui construit cette page. Le nombre de ligne est déterminé via php. En effet, lorsqu'une ligne est ajoutée, la page est rechargée.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

function addLine(formulaire){ var nbLine=<?=(empty($_GET['lineTab']))?('1'):($_GET['lineTab']);?>; formulaire.action='vente_article.php?lineTab='+nbLine; formulaire.submit(); } <form name='formulaire' method='POST'> [..]   <? for ($i=0;$i<$_GET['lineTab'];$i++){?> <tr> <td><input name='supprLine' type='button' value='-'></td> <td><input name='codeArt[<?=$i?>]' type='text'></td> <td><input name='qteArt[<?=$i?>]' type='text'></td> <td><input name='puArt[<?=$i?>]' type='text'></td> <td><input name='pxArt[<?=$i?>]' type='text'></td> </tr> <? } ?> <tr><td colspan='3'>total</td> <td><input name='total' type='text'></td> [..] </form>

---

Selon moi à chaque modification de valeur de l'un des champs prix, il faut recalculer la somme de tous les prix.
Je pensais utiliser un tableau vu que les noms des contrôles texte pxArt sont indexés. Mais ça n'est pas du tout évident.
Sans compter que lorsque l'utilisateur souhaite supprimer une ligne, il a la possibilité de cliquer sur le bouton '-', et là du coup, il faut tout recalculer.
C pourquoi par le grand nombre de calculs à faire, je souhaite faire ça en Javascript plutôt que de recharger à chaque fois la page pour le faire en php.
Si quelqu'un pouvait m'aider, ça serait bien cool, parce que là je commence un peu à galérer.

Merci d'avance.
++

Ta prochaine étape consiste à créer une fonction total() calculant la somme des prix et une fonction calculant le prix d'un article avec comme argument son index.

Tu crées ensuite une fonction actualise() qui calcule le prix de toutes les lignes, le total et affiche le tout. Utilises l'attribut onChange des input pour appeler cette fonction.

Chacune de fonctions ne devrait pas être très compliquée à écrire, mais si t'as besoin aide, reviens nous voir ;)

Hello,

je suis bien d'accord avec ça.
Le hic, est qu'apparemment il n'aime pas les noms donnés aux contrôle de mon formulaire
Par exemple, le contrôle prix de la ligne 15 est selon moi:

Code:

---

1 2	document.formulaire.pxArt[15]

---

mais si j'essaie d'accéder à la valeur de ce contrôle, en faisant:

Code:

---

1 2	document.formulaire.pxArt[15].value

---

Je me fais jetter. Il me répond que pxArt[15] n'a pas de propriétés.
Et puis apparemment document.formulaire.pxArt n'est pas géré comme un tableau.
Contrairement à ce que je pensais.
++

C'est ce qu'il me semblait aussi, mais je n'ai pas voulu m'avancer.
Utilises les id, comme je t'ai appris il n'y a pas longtemps ;)

Ah ouais ?
Y a vraiment pas moyen sans les ID ?

Bon bah dans ce cas, pas de problème.

J'ai peut-etre trouvé une solution:

Code:

---

1 2 3 4 5 6 7

//nbLine: Nombre de ligne du formulaire for (i=0;i<nbLine;i++) { temp=document.forms["formulaire"].elements["pxArt["+i+"]"].value; if ((!isNaN(temp))&&(!isNaN(total))) total=total+parseInt(temp); } alert(total);

---

Le problème est qu'il me répond NaN.

D'après moi, cela vient des méthodes parseInt.
Mais comment puis-je faire ?
++

En fait cela est dû au fait, que parmi les valeurs calculées, il y a des contrôles sans valeurs.
J'ai pourtant verrouillé avec le test:

Code:

---

1 2	if ((!isNaN(temp))&&(!isNaN(total)))

---

mais ça passe à travers.

En effet, apparemment isNaN répond true pour les champs vide.
Le test qu'il faut donc faire :

Code:

---

1 2	if(!isNaN(temp) && (temp!=""))

---

Tu n'as pas besoin de faire le test sur total, car c'est temp qui est parsé. Je te conseille aussi de mettre tous les autres champs autre que quantité en readonly. Comme ça tu es sûr de leur valeur, et que l'utilisateur ne s'amuse pas à faire nimp.

Code:

---

1 2	<input type="text" name="qte1" value="ce que tu veux" readonly />

---