[RESOLU] Saut de champs lors de l'appui sur Entree

Saut de champs lors de l'appui sur Entree [RESOLU] - HTML/CSS - Programmation

Marsh Posté le 13-03-2008 à 13:27:10    

Bonjour, bonjour,
 
Je souhaite 'sauter' plusieurs (12 exactement) textfields lors de la pression par l'utilisateur de la touche entree.
 
J'ai creer suite a quelques lectures de forums le code suivant:

Code :
  1. <body class="body" onkeydown="javascript:if(window.event.keyCode == 13 && window.event.srcElement.type!='textarea'){for(var x = 1; x <= 12; x++){window.event.keyCode = 9;}}">


 
Le probleme est que ce code ne saute que au champ suivant et pas 10 ou 12 champs suivants...  :??:  
Quelqu'un a une idee? :wahoo:  
Merci  :jap:


Message édité par And Garfunkel le 17-03-2008 à 09:27:49
Reply

Marsh Posté le 13-03-2008 à 13:27:10   

Reply

Marsh Posté le 13-03-2008 à 14:09:07    

Pourquoi pas "textarea.focus()" ?

Reply

Marsh Posté le 13-03-2008 à 14:17:54    

Je ne comprends pas trop ta question tpierron?
 
En fait, lors de la pression sur la touche Entree et si ce n'est pas dans un element textarea alors je lance une boucle pour le tab...
 
Mon probleme est que au lieu de passer 11 champs il saute seulement au suivant...

Reply

Marsh Posté le 13-03-2008 à 14:20:59    

Tu peux pas définir le keycode comme ça en espérant que ça simule la touche tab [:petrus75]
 
Il faut récupérer la liste des textarea, et une fois le bon trouvé, lui faire un focus()

Reply

Marsh Posté le 13-03-2008 à 14:25:55    

Ahhh ok! j'ai compris!  
Si le textfield a ce nom la alors je focus sur celui la et  pareil pour chaque textfield, c'est ca nan?
Pourquoi parle tu de textarea?

Reply

Marsh Posté le 13-03-2008 à 14:28:27    

C'est toi qui a parlé de textarea :D

Reply

Marsh Posté le 13-03-2008 à 14:58:41    

Well, je voulais simplement dire, plutôt que de te casser la tête à simuler 12x la pression de la touche TAB, utilise la méthode focus() sur le textarea où tu veux que le focus aille.

Message cité 1 fois
Reply

Marsh Posté le 13-03-2008 à 15:09:54    

tpierron a écrit :

Well, je voulais simplement dire, plutôt que de te casser la tête à simuler 12x la pression de la touche TAB, utilise la méthode focus() sur le textarea où tu veux que le focus aille.


:)
Merci tpierropn et FlorentG! Je pense avoir compris, neanmoins j'ai essaye ca et ca ne fonctionne pas:
L'appel:

Code :
  1. $add_textfield='<input type="text" class="input_text" size="6"   id="'.$seg_name.'_'.$year_id.'_'.$label_id.'" maxlength="8"  style="font-weight:bold; border-style:none; text-align: right;" onblur="javascript:calculate_marketshare(\''.$seg_name.'\','.$year_id.','.$label_id.'); javascript:addition('.$year_id.','.$label_id.'); javascript:rednumbers(\''.$seg_name.'\','.$year_id.','.$label_id.');" onkeydown="enter_jump(event,'.$seg_name.'_'.$year_id.'_'.$label_id.')" onclick="get_lastvalues(\'id='.$seg_name.'_'.$year_id.'_'.$label_id.'_'.$structure_id.'\',\'ajax_lastvalues.php\');" value="'.$display_value.'" name="'.$seg_name.'_'.$year_id.'_'.$label_id.'"/>';
  3. echo $add_textfield;

->regarder onkeydown="enter_jump(event,'.$seg_name.'_'.$year_id.'_'.$label_id.')", , $seg_name.'_'.$year_id.'_'.$label_id.' renvoi newplants_1_1
 
Et la fonction:

Code :
  1. <script language="javascript" type="text/javascript">
  2.     function enter_jump(e,name) {
  3.         var intKey = window.Event ? e.which : e.KeyCode;
  4.        
  5.         if(intKey == 13){
  6.             if(name=='newplants_1_1'){window.getElementById('newplants_2_1').focus();}
  7.      e.returnValue = false;
  9.  }
  10.     }
  11. </script>


 
J'ai aussi essaye ca:

Code :
  1. function enter_jump(event,name) {
  2.        
  3.         if(window.event.keyCode == 13 && window.event.srcElement.type!='textarea'){
  4.                    if(name=='newplants_1_1'){window.getElementById('newplants_2_1').focus();}
  5.  }
  6.     }


 
Rien non plus comment ca se fait?  :??:


Message édité par And Garfunkel le 13-03-2008 à 15:11:57
Reply

Marsh Posté le 13-03-2008 à 15:18:03    

Déjà laisse tomber le onkeydown comme ça, tu va trop de faire chier à le rédiger/débugger, vaudrait mieux le définir via un script externe.

Reply

Marsh Posté le 13-03-2008 à 15:42:00    

Maisheu.... getElementById est une méthode de document pas de window  :sweat: (ça ne m'étonnerai pas que ça passe sous IE).

Reply

Marsh Posté le 13-03-2008 à 15:42:00   

Reply

Marsh Posté le 13-03-2008 à 16:03:55    

en effet, je m'en suis rendu compte apres avoir poste...  
j'ai deja change ca, mais il y a encore d'autres erreurs! Je vais essayer de trouver, mais si tu as une idee, n'hesite pas...
L'erreur est que le champ est soit disant pas defini! :O

Reply

Marsh Posté le 14-03-2008 à 12:25:27    

Une fonction avec un parametre event ne peut prendre aucun autre parametre apparement,.... toutes mes tentatives ont ete infructueuses... :(
Ca aurait ete trop beau de faire un enter_jump(event,seg_name,year_id,label_id), mais ca ne passe pas...

 

Donc j'ai cree deux fonctions en javascript:

 

enter_jump(event);-> renvoie une valeur 0 si keycode different de 'return' et 1 si c'est 'return'
action_enter(seg_name,year_id,label_id) -> focus sur le correct textfield en fonction des parametres.

 

Ma question est donc maintenant:
Comment lancer a partir de n'importe quel textfield la fonction action_enter(balabla); seulement si enter_jump renvoie 1?

 

Pour l'instant j'ai quelque chose qui ressemble a ca en simplifie (sans les autres fonctions javascript):

 
Code :
  1. <input type="text" class="input_text" size="6"   id="name" maxlength="8"  style="font-weight:bold; border-style:none; text-align: right;"  onkeydown="enter_jump(event);" value="" name="name"/>
 

J'aimerais bien integrer la fonction action_enter(baba) a ce input text comme indiquer ci-dessus!
Merci  :jap:

 

EDIT: L'autre solution serait de mettre le focus sur le textfield avec un tabindex+12 par rapport au tabindex du textfield d'ou la fonction est lance... Ca serait plus propre et plus joli mais j'ai aucune idee de comment faire...

Message cité 1 fois
Message édité par And Garfunkel le 14-03-2008 à 12:27:55
Reply

Marsh Posté le 14-03-2008 à 14:28:31    

And Garfunkel a écrit :

Une fonction avec un parametre event ne peut prendre aucun autre parametre apparement,.... toutes mes tentatives ont ete infructueuses... :(


Si, mais faut utiliser un framework genre YUI qui permet de passer aux events des paramètres supplémentaires

Reply

Marsh Posté le 14-03-2008 à 14:40:58    

Ou plus simplement, tu peux aussi assigner tes fonctions de gestion d'événement en javascript, en ajoutant les paramètres nécessaire directement à l'objet. Après, dans ton événement tu pourras utiliser "this" pour récupérer les propriétés. Du genre :
 

Code :
  1. montextfield.onkeydown = jump_event    // Note l'abscence de ().
  2. montextfield.monAttribut = "uneValeur"
  3.  
  4. function jump_event(e)
  5. {
  6.     var intKey = window.Event ? e.which : e.KeyCode;
  7.  
  8.     alert(this.monAttribut)
  9.  
  10.     if (intKey == 13){
  11.         if (this.id == 'newplants_1_1') window.getElementById('newplants_2_1').focus()
  12.         e.returnValue = false;
  13.     }
  14. }


Reply

Marsh Posté le 14-03-2008 à 15:22:59    

Salut Tpierron,
 
Merci de ta reponse, mais meme si je l'ai lu plusieurs fois je n'ai pas vraiment compris....
 
Je viens de faire un truc qui marche parfaitement sous firefox et presque sous IE6:
 
La fonction

Code :
  1. function enter_jump(name,event) {if(event.keyCode == 13){action_enter(name);}}


 
L'appel:

Code :
  1. onkeydown="enter_jump(this.name,event);"


 
La fonction action_enter(name) est une fonction javascript qui s'occupe de faire le focus sur l'element voulu!
Cela marche dans les 2 browsers (ff et ie6) mais dans ie il me submit le formulaire juste apres...  :sweat: , une idee?
 
Edit:
J'ai creer dans le form, cette fonction:

Code :
  1. <form method="POST" id="save_data" name="save_data" action="ajax_save_data.php" onsubmit="return enter_check(event);">


et voila la fonction:

Code :
  1. function enter_check(event){if(event.keyCode == 13){return false;}}


Mais ca ne fonctionne pas non plus  :sweat:  
PS: Le site doit marcher parfaitement sous IE6 car sous intranet...


Message édité par And Garfunkel le 14-03-2008 à 15:30:32
Reply

Marsh Posté le 14-03-2008 à 15:56:11    

Ça me semble correct, je rajouterai un return false dans ton onkeydown :

Code :
  1. onkeydown="enter_jump(this.name,event); return false;"

Message cité 1 fois
Message édité par tpierron le 14-03-2008 à 15:56:29
Reply

Marsh Posté le 14-03-2008 à 17:04:40    

tpierron a écrit :

Ça me semble correct, je rajouterai un return false dans ton onkeydown :

Code :
  1. onkeydown="enter_jump(this.name,event); return false;"



Merci pour ton idee!  :jap: Mais... Hihi!  :D Avec ta proposition, je ne peux plus entrer aucun chiffre ou aucun caractere dans les textfields....
Peut etre une autre idee?  :whistle:  
Merci  :jap:

Reply

Marsh Posté le 14-03-2008 à 17:11:33    

Arf, effectivement, c'était un peu trop brutal comme solution. Sinon, tu peux essayer une légère variante :
 

Code :
  1. onkeydown="return enter_jump(this.name,event)"


 
Et dans enter_jump, si tu détectes l'appuie sur Return, alors retourne false, sinon true.

Reply

Marsh Posté le 17-03-2008 à 09:27:27    

Yahoooo! Merci Tpierron pour ta reponse, je viens d'essayer et ca marche tip top!  :D T'es un chef, merci!  :jap:  :jap:  :jap:  :jap:  

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed