Addition de deux champs texte

Version imprimable

27/07/2009, 17h10
rafikos2

Addition de deux champs texte

bonsoir,
Comme je ne m’y connais pas en java script, je voudrai réaliser une addition de deux input text et le résultat s’affiche dans le 3eme input avec l’événement onchange.
merci.

Voici une ébauche de ce que tu veux faire
(enfin si j'ai bien compris).

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!-- JavaScript -->
<script type="text/javascript">
function calculer() {
	var res = parseInt(document.forms[0].A.value) + parseInt(document.forms[0].B.value);
	document.getElementById('resultat').innerHTML = res;	
}
</script>
 
<!-- HTML -->
<form>
<p>A = <input type="text" name="A" value=""/></p>
<p>B = <input type="text" name="B" value=""/></p>
<p><input type="button" onclick="calculer()" name="bouton" value="calculer"/></p>
<p>A+ B = <span id="resultat">?</span></p>
</form>

mais comme tu le vois, aucune trace de PHP
et peut-être n'es-tu pas sur le bon forum.

Alors, peut-être pensais-tu plutôt à cela :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!-- PHP -->
<?php
$resultat = "?";
if (isset($_POST['A']) && is_numeric($_POST['A']) && isset($_POST['B']) && is_numeric($_POST['B'])) {
        $A=$_POST['A'];
        $B=$_POST['B'];
        $resultat = $A + $B;
} 
?>
 
<!-- HTML / PHP -->
<form action="" method="post" >
<p>A = <input type="text" name="A" value="<?php if (isset($A)) echo $A; ?>"/></p>
<p>B = <input type="text" name="B" value="<?php if (isset($B)) echo $B; ?>"/></p>
<p><input type="submit" name="bouton" value="calculer"/></p>
<p>A+ B = <?php echo $resultat; ?></p>
</form>

mais là pas de JavaScript, ni de onchange.
Fred

28/07/2009, 00h25
rafikos2

Merci d’avoir répondu
La première proposition est bien, mais ce que je veux faire exactement par exemple : je saisi un chiffre dans le 1er input, puis a la saisi du 2eme chiffre dans le 2eme input, le résultat apparaît dans le 3eme input (sans que je click sur un bouton), je crois que c’est un événement onchange qui s’applique sur le 2eme input.
Merci de votre aide.

Je ne suis pas expert en JavaScript,
mais bon,
c'est en forgeant qu'on devient forgeron
alors voici une nouvelle mouture
peut-être plus proche de tes attentes :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!-- JavaScript -->
<script type="text/javascript">
function calculer() {
	var inputA = parseFloat(document.getElementById('A').value);	
	var inputB = parseFloat(document.getElementById('B').value);	
	var res='?';
	if (!isNaN(inputA) && !isNaN(inputB)) {
	    res = parseFloat(inputA + inputB); 
		document.getElementById('resultat').innerHTML = res;
	} else res = '?';
}
window.onload = function() { calculer(); };
</script>
 
<!-- HTML -->
<p>A = <input id="A" type="text" value="" onkeyup="calculer()"/></p>
<p>B = <input id="B" type="text" value="" onkeyup="calculer()"/></p>
<p>A+ B = <span id="resultat">?</span></p>

Fred

28/07/2009, 10h35
rafikos2

Bonjours,
C’est exactement ce que je veux faire, je vous remercie.
Juste une petite question, est-ce que vous pouvez me conseillez ou si vous connaissez un bon livre en javascript ? parce que j'utilise php et lui seul ne suffit pas.
Merci.
28/07/2009, 10h52
andry.aime

Bonjour,
Les livres javascript:
http://javascript.developpez.com/livres/
28/07/2009, 11h06
rafikos2

Merci pour le lien.