dans un formulaire, j'ai 4 valeurs numériques a saisir.
Dans un 5eme champ je voudrais placer la somme des 4 valeurs automatquement
dès que l'une des valeurs saisie change.
J'ai donc pense a utiliser onchange, mais je souhaiterais que ce calcul se
fasse pour chaque frappe au clavier.
onchange a l'air de fonctionner lorsque que l'on quitte le champ.
J'utilise aussi onkeypress pour n'accepter que des valeurs numériques au
clavier.
dans un formulaire, j'ai 4 valeurs numériques a saisir.
Dans un 5eme champ je voudrais placer la somme des 4 valeurs automatquement
dès que l'une des valeurs saisie change.
J'ai donc pense a utiliser onchange, mais je souhaiterais que ce calcul se
fasse pour chaque frappe au clavier.
onchange a l'air de fonctionner lorsque que l'on quitte le champ.
J'utilise aussi onkeypress pour n'accepter que des valeurs numériques au
clavier.
dans un formulaire, j'ai 4 valeurs numériques a saisir.
Dans un 5eme champ je voudrais placer la somme des 4 valeurs automatquement
dès que l'une des valeurs saisie change.
J'ai donc pense a utiliser onchange, mais je souhaiterais que ce calcul se
fasse pour chaque frappe au clavier.
onchange a l'air de fonctionner lorsque que l'on quitte le champ.
J'utilise aussi onkeypress pour n'accepter que des valeurs numériques au
clavier.
onkeypress pour filtrer, onkeyup pour calculer.
Un petit exemple rapide :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head><title></title>
<script type="text/javascript">
function addEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, true);
return true;}
if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;}
return false;
}
var Combi = function(){
_self=this;
this.t1=document.getElementById("t1");
this.t2=document.getElementById("t2");
this.t3=document.getElementById("t3");
this.t4=document.getElementById("t4");
this.res=document.getElementById("res");
setRes=function(){
_self.res.value=(+_self.t1.value)
+(+_self.t2.value)
+(+_self.t3.value)
+(+_self.t4.value);};
addEvent(this.t1,'keyup',setRes);
addEvent(this.t2,'keyup',setRes);
addEvent(this.t3,'keyup',setRes);
addEvent(this.t4,'keyup',setRes);
}
function init(){
window.combi=new Combi()}
addEvent(window,"load",init);
</script>
</head>
<body>
<form action="">
<p><input id="t1" name="t1" value="0"></p>
<p><input id="t2" name="t2" value="0"></p>
<p><input id="t3" name="t3" value="0"></p>
<p><input id="t4" name="t4" value="0"></p>
<p><input id="res" name="res" value="0" disabled="disabled"
style="font-weight:bold; color:navy; background:gold"></p>
</form>
</body>
</html>
--
Y.D.
onkeypress pour filtrer, onkeyup pour calculer.
Un petit exemple rapide :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head><title></title>
<script type="text/javascript">
function addEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, true);
return true;}
if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;}
return false;
}
var Combi = function(){
_self=this;
this.t1=document.getElementById("t1");
this.t2=document.getElementById("t2");
this.t3=document.getElementById("t3");
this.t4=document.getElementById("t4");
this.res=document.getElementById("res");
setRes=function(){
_self.res.value=(+_self.t1.value)
+(+_self.t2.value)
+(+_self.t3.value)
+(+_self.t4.value);};
addEvent(this.t1,'keyup',setRes);
addEvent(this.t2,'keyup',setRes);
addEvent(this.t3,'keyup',setRes);
addEvent(this.t4,'keyup',setRes);
}
function init(){
window.combi=new Combi()}
addEvent(window,"load",init);
</script>
</head>
<body>
<form action="">
<p><input id="t1" name="t1" value="0"></p>
<p><input id="t2" name="t2" value="0"></p>
<p><input id="t3" name="t3" value="0"></p>
<p><input id="t4" name="t4" value="0"></p>
<p><input id="res" name="res" value="0" disabled="disabled"
style="font-weight:bold; color:navy; background:gold"></p>
</form>
</body>
</html>
--
Y.D.
onkeypress pour filtrer, onkeyup pour calculer.
Un petit exemple rapide :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head><title></title>
<script type="text/javascript">
function addEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, true);
return true;}
if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;}
return false;
}
var Combi = function(){
_self=this;
this.t1=document.getElementById("t1");
this.t2=document.getElementById("t2");
this.t3=document.getElementById("t3");
this.t4=document.getElementById("t4");
this.res=document.getElementById("res");
setRes=function(){
_self.res.value=(+_self.t1.value)
+(+_self.t2.value)
+(+_self.t3.value)
+(+_self.t4.value);};
addEvent(this.t1,'keyup',setRes);
addEvent(this.t2,'keyup',setRes);
addEvent(this.t3,'keyup',setRes);
addEvent(this.t4,'keyup',setRes);
}
function init(){
window.combi=new Combi()}
addEvent(window,"load",init);
</script>
</head>
<body>
<form action="">
<p><input id="t1" name="t1" value="0"></p>
<p><input id="t2" name="t2" value="0"></p>
<p><input id="t3" name="t3" value="0"></p>
<p><input id="t4" name="t4" value="0"></p>
<p><input id="res" name="res" value="0" disabled="disabled"
style="font-weight:bold; color:navy; background:gold"></p>
</form>
</body>
</html>
--
Y.D.
je n'avais pas encore vu cette façon d'insérer des evenements en dehors de
<input>
Je mettais cela directement dans le <input>.
Cela semble plus simple et plus clair de séparer.
Je pense avoir compris le fonctionnement mis à part:
où doit on placer la fonction suivante
addEvent(window,"load",init);
Je travaille en PHP et je pensais qu'il fallait utilisdr <body onload > "init()">
pour activer du javascript au démarrage
Je ne comprends pas
windows.combi = new Combi()
combi n'est pas un membre de windows à mon avis.
Est ce que l'on aurait pu mettre windows.toto = new Combi().
On y met la fonction d'initialisation,mais il faudrait qu'elle soit appelée
apres la construction du formulaire,
puisqu'on fait reference à t1,t2... qui ne sont définis que plus tard.
Ton exemple fonctionne parfaitement
Je pense qu'il me manque quelques clés pour comprendre pouquoi cela
fonctionne
je n'avais pas encore vu cette façon d'insérer des evenements en dehors de
<input>
Je mettais cela directement dans le <input>.
Cela semble plus simple et plus clair de séparer.
Je pense avoir compris le fonctionnement mis à part:
où doit on placer la fonction suivante
addEvent(window,"load",init);
Je travaille en PHP et je pensais qu'il fallait utilisdr <body onload > "init()">
pour activer du javascript au démarrage
Je ne comprends pas
windows.combi = new Combi()
combi n'est pas un membre de windows à mon avis.
Est ce que l'on aurait pu mettre windows.toto = new Combi().
On y met la fonction d'initialisation,mais il faudrait qu'elle soit appelée
apres la construction du formulaire,
puisqu'on fait reference à t1,t2... qui ne sont définis que plus tard.
Ton exemple fonctionne parfaitement
Je pense qu'il me manque quelques clés pour comprendre pouquoi cela
fonctionne
je n'avais pas encore vu cette façon d'insérer des evenements en dehors de
<input>
Je mettais cela directement dans le <input>.
Cela semble plus simple et plus clair de séparer.
Je pense avoir compris le fonctionnement mis à part:
où doit on placer la fonction suivante
addEvent(window,"load",init);
Je travaille en PHP et je pensais qu'il fallait utilisdr <body onload > "init()">
pour activer du javascript au démarrage
Je ne comprends pas
windows.combi = new Combi()
combi n'est pas un membre de windows à mon avis.
Est ce que l'on aurait pu mettre windows.toto = new Combi().
On y met la fonction d'initialisation,mais il faudrait qu'elle soit appelée
apres la construction du formulaire,
puisqu'on fait reference à t1,t2... qui ne sont définis que plus tard.
Ton exemple fonctionne parfaitement
Je pense qu'il me manque quelques clés pour comprendre pouquoi cela
fonctionne
Dans ma fonction de calcul de somme, j'avais besoin d'un parametre.
Je l'ai passé en argument de la fonction javascript.
Ensuite, je me suis paerçu qu'au premier affichage, il fallait appeler cette
fonction, [...]
J'ai fait la chose suivante qui ne ma parait pas elegant du tout.
Lorsque je cree mon formulaire,, à la fin j 'ai écrit
?>
<script language="javascript">
<!--
calculsomme(<?php echo $parametre ?>) ;
//-->
</script>
<?php
Aurais tu une petite piste pour améliorer cela.
$parametre s'obtient à partir d'une requete à une bdd effectuée avant la
creation du formulaire.
Dans ma fonction de calcul de somme, j'avais besoin d'un parametre.
Je l'ai passé en argument de la fonction javascript.
Ensuite, je me suis paerçu qu'au premier affichage, il fallait appeler cette
fonction, [...]
J'ai fait la chose suivante qui ne ma parait pas elegant du tout.
Lorsque je cree mon formulaire,, à la fin j 'ai écrit
?>
<script language="javascript">
<!--
calculsomme(<?php echo $parametre ?>) ;
//-->
</script>
<?php
Aurais tu une petite piste pour améliorer cela.
$parametre s'obtient à partir d'une requete à une bdd effectuée avant la
creation du formulaire.
Dans ma fonction de calcul de somme, j'avais besoin d'un parametre.
Je l'ai passé en argument de la fonction javascript.
Ensuite, je me suis paerçu qu'au premier affichage, il fallait appeler cette
fonction, [...]
J'ai fait la chose suivante qui ne ma parait pas elegant du tout.
Lorsque je cree mon formulaire,, à la fin j 'ai écrit
?>
<script language="javascript">
<!--
calculsomme(<?php echo $parametre ?>) ;
//-->
</script>
<?php
Aurais tu une petite piste pour améliorer cela.
$parametre s'obtient à partir d'une requete à une bdd effectuée avant la
creation du formulaire.
Comment est ce que l'on pourrait utiliser addEvent directement dans
FormModify()
J'ai bien essayé de choses
echo '<script type="text/javascript">' ;
echo '<!--' ;
echo 'this.elt = document.getElementById("'.$fieldName.'") ;'
echo 'addEvent(this->elt,"keyup",calcul($param)) ;'
echo '//--></script>'
Mais deux choses coincent :
this->elt ne correspond pas à un objet
utliser un argument dans la fonction calcul pose probleme
Aurais tu quelques pistes
Encore merci de ton aide
Jeff
Comment est ce que l'on pourrait utiliser addEvent directement dans
FormModify()
J'ai bien essayé de choses
echo '<script type="text/javascript">' ;
echo '<!--' ;
echo 'this.elt = document.getElementById("'.$fieldName.'") ;'
echo 'addEvent(this->elt,"keyup",calcul($param)) ;'
echo '//--></script>'
Mais deux choses coincent :
this->elt ne correspond pas à un objet
utliser un argument dans la fonction calcul pose probleme
Aurais tu quelques pistes
Encore merci de ton aide
Jeff
Comment est ce que l'on pourrait utiliser addEvent directement dans
FormModify()
J'ai bien essayé de choses
echo '<script type="text/javascript">' ;
echo '<!--' ;
echo 'this.elt = document.getElementById("'.$fieldName.'") ;'
echo 'addEvent(this->elt,"keyup",calcul($param)) ;'
echo '//--></script>'
Mais deux choses coincent :
this->elt ne correspond pas à un objet
utliser un argument dans la fonction calcul pose probleme
Aurais tu quelques pistes
Encore merci de ton aide
Jeff
Tout est ok maintenant,
il fallait mettre
addEvent(elt,"keyup",function(){calcul($param)}) ;
Tout fonctionne.
La seule chose qui ne fonctionne pas, c'est lorsque j'ai voulu remplacer ma
fonciton
loadAll(oneMore)
qui charge plusieurs fonctions au demarrage (chargement du menu déroulant -
timer...)
par des addEvent(window,"load",function);
Cela ne fonctionne plus avec le chargement du menu.
Je pense que certains elements ne sont pas encore definis, ou alors que la
fonciton window.load agit différemment qu'avec addEvent(window,"load"
Tout est ok maintenant,
il fallait mettre
addEvent(elt,"keyup",function(){calcul($param)}) ;
Tout fonctionne.
La seule chose qui ne fonctionne pas, c'est lorsque j'ai voulu remplacer ma
fonciton
loadAll(oneMore)
qui charge plusieurs fonctions au demarrage (chargement du menu déroulant -
timer...)
par des addEvent(window,"load",function);
Cela ne fonctionne plus avec le chargement du menu.
Je pense que certains elements ne sont pas encore definis, ou alors que la
fonciton window.load agit différemment qu'avec addEvent(window,"load"
Tout est ok maintenant,
il fallait mettre
addEvent(elt,"keyup",function(){calcul($param)}) ;
Tout fonctionne.
La seule chose qui ne fonctionne pas, c'est lorsque j'ai voulu remplacer ma
fonciton
loadAll(oneMore)
qui charge plusieurs fonctions au demarrage (chargement du menu déroulant -
timer...)
par des addEvent(window,"load",function);
Cela ne fonctionne plus avec le chargement du menu.
Je pense que certains elements ne sont pas encore definis, ou alors que la
fonciton window.load agit différemment qu'avec addEvent(window,"load"