Addition de résultats

Version imprimable

27/05/2011, 14h53
anita07

Addition de résultats

Bonjour,

Je suis nouvelle sur ce forum php. Cela fait quelques jours seulement que j'ai commencé à adapter des scripts que je trouve sur le net.

Ma question:

Dans mon formulaire, j'ai 2 fonctions de calcul qui chacune place leur résultat dans un champs texte.

Pour l'instant, j'ai réussi à additionner ces 2 résultats dans un 3ème champs texte, en exécutant une fonction attachée à un bouton commande.

J'aimerais savoir s'il est possible que le résulat de l'addition s'affiche automatiquement dans un champs texte?

Quelqu'un peut me guider svp?

Merci,

Anita
27/05/2011, 15h05
SpaceFrog

oui en changeant l'evenement declencheur
onchange ou onblur sur les champs de saisie ...
27/05/2011, 16h15
RomainVALERI

D'accord avec SpaceFrog, regarde par ici il y a un peu plus de détails :)

Sinon à part ça,

Citation:

Envoyé par anita07

Bonjour,

Je suis nouvelle sur ce forum php. [...]

Citation:

Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript

:koi: ?

ça va pas...?

Code:

1
2
3
4
 
<input name="total" type="text" id="total" size="6" onchange = "Fct_Somme();"/>
 
<input type="text" id="totalcost" name="totalcost" onchange = "Fct_Somme();"/>

27/05/2011, 16h36
SpaceFrog

si mais as tu pris en compte que le onchange necessiste deux critères
la modification du value ET la perte de focus de l'input
27/05/2011, 16h48
Watilin

Sinon y'a aussi onkeyup qui peut être intéressant.

Edit: Me suis gourré à propos des claviers virtuels, oubliez ce que j'ai dit.
27/05/2011, 17h08
anita07

donc, si j'ai bien compris :?, il faut que je récupére les valeurs calculées...quelque part? ...dans une variable...par exemple?
27/05/2011, 17h17
SpaceFrog

non tu fais le calcul en direct a chaque fois, y'a pas de contre indication !

Il n'y a jamais trop de variables quand on débute.

Comme je ne sais pas trop ce que tu connais ou pas, je vais te donner quelques trucs :

– le truc du this :

Code:

<input type="text" onchange="alert(this.value);" />

– le truc de l'id :
Code:

1 2 <input type="text" id="zbam" /> <input type="button" value="clic" onclick="alert(document.getElementById('zbam').value);" />
– on mélange un peu tout ça :
Code:

1 2 3 function faireLeCafe( val ) { document.getElementById('chose').value = val; }
Code:

1 2 <input id="chose" type="text" readonly="readonly" /> <input type="text" onkeyup="faireLeCafe(this.value);" />
;)

27/05/2011, 17h41
anita07

ok, je vois...quand je clique dans le champs et que j'en resort, il fait le calcul...en fait, c'est pas très "automatique". Il faut un truc en plus...

Merci pour vos réponses, si jamais je ne m'en sors pas, soit je reviens vers vous, soit je garde mon bouton....

Bon soirée,

Anita:ccool:
27/05/2011, 17h43
anita07

oups, j'ai pas vu ton message Watilin......

je regarde cela demain.....j'ai les yeux en bouillie.

Merci

Je laisse ouvert
30/05/2011, 14h16
anita07

Bonjour,

J'ai tenu en compte vos commentaires (et au-delà même), mais je coince.

Cela fonctionne avec onblur, mais il faut cliquer une fois dans le champ, en ressortir et recliquer dedans pour que cela fonctionne????
30/05/2011, 14h53
Watilin

Tu coinces où exactement ? On peut voir ton code ?

Visiblement les champs input réagissent au "onChange" lorsqu'on fait un "onBlur"

Il faudrait plutôt utiliser un des événements key(up/down/press), j'ai essayé avec le clavier virtuel de Seven, il réagit bien.

Mon petit script pour tester
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript"> function test(el){ mot=el.value; document.getElementById("toto").innerHTML+=mot+"<br/>" } </script> </head> <body> <div id="toto"> </div> <input type="text" onChange="test(this);" onKeyUp="test(this)" /> </body> </html>

Voici mon champ "total" qui reçoit le calcul ( quantité*PU*TVA...)

Code:

<input name="total" type="text" id="total" value="0.00" size="6" onblur = "Fct_Somme();"/>

Voici mon champs "totalcost" qui reçoit un autre calcul ( calcul valeur chkboxes)

Code:

<input name="totalcost" type="text" id="totalcost" value="0.00" onblur = "Fct_Somme();"/>

le champ qui reçoit l'addition des 2 totaux

Code:

<input name = "RESULTAT" type = "text" value="0.00" >

et voici la fonction
Code:

1 2 3 4 5 6 function Fct_Somme(){ var O_Form = document.SOMME; var Val_1 = parseFloat( O_Form.total.value); var Val_2 = parseFloat( O_Form.totalcost.value); O_Form.RESULTAT.value = ( Val_2 +Val_1); }
comme je l'ai dit, ça marche, mais en cliquant et recliquant!

PS: je débute en java et php

30/05/2011, 16h48
NoSmoking

Bonjour,
comme il a été suggéré, remplaces onblur par onkeyup

Code:

<input name="total" type="text" id="total" value="0.00" size="6" onkeyup = "Fct_Somme();"/>

Code:

<input name="totalcost" type="text" id="totalcost" value="0.00" onkeyup = "Fct_Somme();"/>
30/05/2011, 17h35
anita07

je l'avais déjà fait, avec tous les onkey possibles mais là, rien ne se passe...

j'ai essayé d'autres choses mais bon...je vais voir du côté des tabindex...sinon, j'ai mon bouton

Merci,

Anita

je vais partir en supputation
...la structure du document est incorrecte, manque la FORM qui est référencée dans la fonction...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
<head>
<script type="text/javascript">
function Fct_Somme(){
  var O_Form = document.SOMME;
  var Val_1 = parseFloat( O_Form.total.value);
  var Val_2 = parseFloat( O_Form.totalcost.value);
  O_Form.RESULTAT.value = ( Val_2 +Val_1);
}
</script>
</head>
<body>
<form id="SOMME" name="SOMME">
  <input name = "total"     type = "text" id="total"      value="0.00" onkeyup = "Fct_Somme();">
  <input name = "totalcost" type = "text" id="totalcost"  value="0.00" onkeyup = "Fct_Somme();">
  <input name = "RESULTAT"  type = "text" value="0.00">
</form>
</body>
</html>

30/05/2011, 20h29
anita07

j'ai pas mis tout le code, mais le form id est bien indiqué dans mon document.

tout à l'air correct dans le code, sauf que...:aie:

Je vous remercie,

Je vais essayer de trouver,

Anita
30/05/2011, 21h15
NoSmoking

l'accès à la FORM de la sorte

Code:

var O_Form = document.SOMME;

IMPOSE que la FORM est un NAME valant SOMME

pour l'accès si il y a simplement une ID il te faut passer par

Code:

var O_Form = document.getElementById('SOMME');

est ce que tu arrives au moins à faire fonctionner l'exemple que je t'ai proposé?
16/06/2011, 22h40
anita07

scusez pour la réponse tardive...

ça marche toujours pas sur mon document (que je laisse tomber), mais j'ai fait quelques tests en dehors, cela fonctionne :D

Merci à vous tous,

:resolu:

Fuseau horaire GMT +2. Il est actuellement 23h11.