Addition de résultats

**anita07** · 27/05/2011, 14h53

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

**SpaceFrog** · 27/05/2011, 15h05

oui en changeant l'evenement declencheur
onchange ou onblur sur les champs de saisie ...

**RomainVALERI** · 27/05/2011, 16h15

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

Sinon à part ça,

Envoyé par anita07

Bonjour,

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

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

?

**anita07** · 27/05/2011, 16h33

ça va pas...?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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();"/>

**SpaceFrog** · 27/05/2011, 16h36

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

**Watilin** · 27/05/2011, 16h48

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

Edit: Me suis gourré à propos des claviers virtuels, oubliez ce que j'ai dit.

**anita07** · 27/05/2011, 17h08

donc, si j'ai bien compris

, il faut que je récupére les valeurs calculées...quelque part? ...dans une variable...par exemple?

**SpaceFrog** · 27/05/2011, 17h17

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

**Watilin** · 27/05/2011, 17h33

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 HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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

– le truc de l'id :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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 JS :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**anita07** · 27/05/2011, 17h41

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

**anita07** · 27/05/2011, 17h43

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

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

Merci

Je laisse ouvert

**anita07** · 30/05/2011, 14h16

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????

**Watilin** · 30/05/2011, 14h53

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

**bewidia** · 30/05/2011, 15h11

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 :

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
<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>

**anita07** · 30/05/2011, 16h04

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 <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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

et voici la fonction

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**NoSmoking** · 30/05/2011, 16h48

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**anita07** · 30/05/2011, 17h35

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

**NoSmoking** · 30/05/2011, 18h53

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

Code :

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
<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>

**anita07** · 30/05/2011, 20h29

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...

Je vous remercie,

Je vais essayer de trouver,

Anita

**NoSmoking** · 30/05/2011, 21h15

l'accès à la FORM de la sorte

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

est ce que tu arrives au moins à faire fonctionner l'exemple que je t'ai proposé?

Addition de résultats

JavaScript

Discussions similaires

Partager

Partager