Débutant en javascript, je cherche à faire une facture avec calcul automatique des totaux.
J'ai plusieurs lignes comprenant chacune une désignation, une quantité, un prix unitaire et un total.
Le nombre de lignes est créé dynamiquement, ce qui donne
----------------------------------------------------
Désignation - quantité - prix unitaire --> total ligne
Désignation - quantité - prix unitaire --> total ligne
Désignation - quantité - prix unitaire --> total ligne
Désignation - quantité - prix unitaire --> total ligne
Désignation - quantité - prix unitaire --> total ligne
----------------------------------------------------
TOTAL HT : somme(nb total de "total ligne")
TVA
TOTAL TTC
avec comme des id créés automatiquement : designation_01, quantite_01, prix_01, totalLigne_01, designation_02, quantite_02, prix_02, totalLigne_02,...
J'ai comme idée de faire une fonction qui récupère toutes id "montant_xxx", les stocke dans un array (tout en les mettant à jour dans le tableau lors de modif des prix/quantités), calcul la somme de toutes ces lignes et les mets dans le champ "TOTAL HT"
Je ne sais pas comment faire la suite ni si ma démarche est bonne.
Ceci dit, les totaux de chaque ligne se calcule bien dynamiquement, me reste plus que le montant HT, TVA et montantTTC.
Je crois ne pas avoir été assez clair.
mes champs sont constitués comme cela :
<textarea id="designation_01" rows="3" cols="79">saisir la désignation de la réparation</textarea>
<textarea id="designation_02" rows="3" cols="79">saisir la désignation de la réparation</textarea>
etc...
les id sont créés dynamiquement. Je cherche à récupérer toutes les valeurs calculées dans l'id "montant_01", "montant_02", ..., "montant_XX" et les stocker dans une variable.
Il faut donc que je recherche dans tous les "id" ceux qui sont nommés "montant_XX".
Après quelques recherches, j'ai trouvé 2 pistes : les fonctions exec() et contains().
Je souhaiterai combiner les deux en faisant quelquechose du genre :
<SCRIPT language=javascript>
var reg=new RegExp("^montant_","g");
var listeIdMontant; //Récupération de tous les id "montant_"
reg.exec(listeIdMontant);
</SCRIPT>
avec un mix de contains() du genre :
if(document.all.ce_fichier.contains("montant_")) //avec une regexp
Voilà, si quelqu'un a une idée, elle serait la bienvenue. Je continue à cherche de mon côté.
Il est possible de récuperer les montants à partir des balises en opérant un tri sur les id.
var i,som=0;
var npt=document.getElementsByTagName('input');l=npt.length;
for (i=0;i<l;i++)
if (npt[i].id.substr(0,8)=="montant_") s+=parseInt(npt[i].value);
Une autre solution consisterait à distinguer ces inputs par une classe particulière (class="mntnt") pour tester la présence de celle-ci.
if (/mntnt/.test(npt[i].className)) s+=parseInt(npt[i].value);
Mais, Ajax semble ici plus approprié pour produire une facture, avec un montant en chiffres et en lettres...
Merci beaucoup pour vos explications, je vais tester tout ça. Le code est assez clair.
Sinon j'utilise Ajax pour envoyer les données de la facture et l'enregistrer dans la base de données.
//---------------
function UpDate(){
var Ind = 1,
Obj = null,
Qte,
Prix,
Total = 0,
Valeur;
//-- tant que l'objet existe
while( Obj = document.getElementById( "quantite_" +Ind)){
//-- recup des valeurs
Qte = parseInt( Obj.value);
Prix = parseFloat( document.getElementById( "prix_" +Ind).value);
Valeur = Qte * Prix; // pas mis les tests si isNaN
//-- affiche le resultat
document.getElementById( "montant_" +Ind).value = Valeur;
//-- ajoute dans total
Total += Valeur;
//-- au suivant
Ind ++;
}
//-- mets dans total
document.getElementById( "total").value = Total;
}
dans ce cas on parcours tous les éléments qui possèdent une ID commencant par quantite_ et si existe on fait les opérations.
La seule contrainte est d'avoir des INPUTs avec des IDs qui se suivent, mais c'est ton cas...
quant à
...j'utilise Ajax pour envoyer les données de la facture...
il me semble qu'une bonne vielle méthode POST ou GET des FORMs est suffisante.
Ne pas oublier de faire les tests coté serveur!
;O)
Merci à toi pour ta méthode alternative. J'ai essayé la méthode de 007Julien qui marche très bien. J'y ai rajouté le traitement pour les NaN.
Et en lignes de code, c'est moins long (mais plus efficace que ta méthode ? bonne question...)
En tout cas, toutes vos méthodes me font évoluer en JS ;o)
Merci
Bonjour,
Tout d'abord je tiens à préciser que la fonction que je t'ai mise fait le calcul ligne par ligne et le total des colonnes montant, elle est a mettre sur l'événement onchange par exemple des INPUTs type text.
En tout cas, toutes vos méthodes me font évoluer en JS ;o) c'est pour cela que je me permets d'écrire ce qui suit...
Et en lignes de code, c'est moins long(mais plus efficace que ta méthode ? bonne question...)
Longueur code :
Il faut comparer le comparable,
l'équivalent de la fonction de 007Julien, pour calculer la somme des totaux, est
//-----------------
function fctWhile(){
var Ind = 1,
Obj = null,
Somme = 0;
while((Obj = document.getElementById( "montant_0" +Ind++))){
Somme += parseInt( Obj.value);
}
return( Somme);
}
à comparer donc avec
//-----------------
function fctJulien(){
var i, som = 0;
var npt = document.getElementsByTagName("input");
var l = npt.length;
for (i = 0; i < l; i++) {
if (npt[i].id.substr(0, 8) == "montant_") {
som += parseInt(npt[i].value);
}
}
return( som);
}
...en terme de longueur c'est équivalent ou presque, la longueur de code n'étant pas prépondérante il est préférable de parler d'optimisation de code...
Efficacité :
si le résultat est le même, et il l'est, on a donc la même efficacité.
Vitesse :
la les choses sont différentes...
j'ai réalisé quelques tests rapides, sur 1000 boucles, dont je livre le résultat en ms ici
Tout d'abord ces valeurs sont à prendre en relatif bien sûr!
On voit que la fctWhile() est pour ainsi dire constante alors que la fctJulien() augmente avec le nombre d'INPUTs dans le document.
La fctJulien() pêche dans le sens où elle va parcourir TOUS les inputs, même les non concernés. Elle a cependant l'avantage d'être indépendante du chrono des INPUTs
Conclusion :
Que sont quelques ms au regard du temps que l'on perd dans les bouchons pour aller se faire dorer la pilule?
L'important reste que le résultat obtenu soit le résultat attendu!
L'étude n'est pas forcément complète, compte tenu de l'influence éventuelle des autres fonctions natives.
Bravo pour cette étude exhaustive... Souhaitons simplement à l'auteur d'avoir beaucoup de clients avec des commandes aussi volumineuses !
Plus sérieusement, je reconnais que la troisième variante a bonne allure indépendamment du fait qu'elle recalcule les montants. Peut-être conviendrait-il de marier les variantes pour :
1/- Recenser, dans un tableau (ou objet), les indices existants par exemple sur les indices des désignations (s'il s'agit des identifiants d'articles choisis par le client, ceux-ci n'ont aucune raison d'être assimilable à la suite des entiers naturels),
2/- Inventorier alors, comme il est proposé mais à partir de ce tableau, les autres champs (inputs ou autres) pour calculer les montants et leur somme à partir des prix et quantités (je m'étonne d'ailleurs que ces quatre éléments soient dans des inputs... Le client fixe aussi les prix ?).
Quant à améliorer les performances d'un script, précisons que l'incorporation dans un objet permet souvent de gagner du temps (les fonctions ne sont interprétées qu'une fois à la création de l'objet), j'invite d'ailleurs les candidats à améliorer ce Compte est bon comme je l'ai précisé en publiant le script correspondant sur ce site.
Merci à vous deux d'éclairer ma lanterne. En tout cas, tout ceci est instructif. En ce qui concerne le prix, pour l'instant il est fixé par le vendeur, mais il y a aura une gestion d'articles ultérieurement.
