modifier la touche [entrée] dans un formulaire

Version imprimable

04/12/2007, 22h14
troumad

modifier la touche [entrée] dans un formulaire

Bonsoir

Je me pose une question métaphysique...
Je souhaite faire une petite page php pour modifier une base de données.
Celle-ci se présente comme un tableau avec des cases préremplies à modifier : un formulaire (balise form).

Je pense qu'il serait utile/agréable pour l'utilisateur habitué à un tableur que la touche entrée ne valide pas le formulaire, mais fasse passer à la casse suivante.

Est-ce faisable ? Est-ce un machin tellement courant que ma question vous semble idiote ?
Est-ce sans espoir ?

salut,

tu peux facilement en javascript... le code de la touche entree est 13 je crois si je me rappelle bien :roll:

edit :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 <html> <head> <script type="text/javascript"> function mafonction(e) { if (window.event) {e=event;} // IE if(e.keyCode == 13) { alert("entree"); } } </script> </head> <body onkeypress="javascript:mafonction(event);"> </body> </html>

04/12/2007, 22h58
troumad

Merci, ça progresse ;)

Maintenant, il me faut :
1) simuler l'appui sur la touche Tab
2) rajouter onkeypress="javascript:mafonction(event);" sans accéder à la balise <body> qui est définie dans un autre document.

Je trouverais peut-être facilement après une nuit de sommeil ;)
05/12/2007, 02h23
Shinuza

Salut,

J'ai fais ça y'a 6 mois, c'est loin d'être top, mais ça fait la blague :

http://verybadman.free.fr/editable/
05/12/2007, 09h49
troumad
Citation:

Envoyé par Shinuza

http://verybadman.free.fr/editable/

Pas mal !
Ce n'est pas tout à fait ce que je cherche.
Tu ne rediriges pas la touche [Entrée].
Par contre, ton code me montre que je ne maitrise pas tout :( . Surtout dans http://verybadman.free.fr/editable/application.js où je ne vois pas pourquoi tu as mis des fonctions dans une fonction et je ne sais pas non plus ce que représente tes $ dans
Code:

1 2 var tb = $(tableId), tds = $t(tb,"td");
Autre remarque : pourquoi n'alignes-tu pas tes { avec tes } ? Tu trouves que c'est plus lisible ?
Pour ma part, j'aime bien quand je vois un { voir rapidement où il se ferme : le } qui est en dessous. De même avec le { , je cherche celui qui est au dessus.
Code:

1 2 3 4 5 6 dsqfqsf hghdgj { mpofjumoigh slqijfaeslfuqo }

Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 function $(el){ return document.getElementById(el); } function $t(el,tag) { return el.getElementsByTagName(tag); } function $c(nodeSet,cName) { var i = 0, el = nodeSet[i], sortedNodeSet = []; while(el) { if(el.nodeName == "#text") { i++; el = nodeSet[i]; continue; } if(el.className == cName) { sortedNodeSet.push(el); } i++; el = nodeSet[i]; } return sortedNodeSet; }
$() -> GetElementById
$t() -> GetElementsByTagName
$c() -> GetElementsByClassName

Le script n'est bien sur pas ce que tu demandes, il faut l'adapter, changer le code touche (tab) pour celui de la touche éntrée.

Ensuite ça dépend de ce que tu veux faire en terme d'ergo

05/12/2007, 12h58
SpaceFrog

plus simplement:
ne mets pas de bouton submit et remplace le par

Code:

<input type='button' onclick='this.form.submit()' value="envoyer" />

la touche enter ne validera plus le form ...
05/12/2007, 13h49
troumad

Ceci évite au moins la validation avec la touche entrée !
Maintenant, il va falloir que je modifie l'action de la touche [entrée] qui devra renvoyer sur l'item suivant.
05/12/2007, 13h54
SpaceFrog

j'ai collé un truc dans les codes sources sufit de capter la touche entrée et de jouer avec les tabIndex ...
05/12/2007, 15h09
troumad

Citation:

Envoyé par SpaceFrog

j'ai collé un truc dans les codes sources sufit de capter la touche entrée et de jouer avec les tabIndex ...

Où ça ?
Dans http://javascript.developpez.com/sources/ ? Je n'ai pas trouvé ?
05/12/2007, 15h25
SpaceFrog

peut être dans la FAQ alors ... ?

http://javascript.developpez.com/faq...js#TexteSuivat

là c'est sur la taille max mais suffit de l'adapter ..
05/12/2007, 15h32
troumad

J'avais vu ce script. Mais, il impose de connaitre avec une variable globale la case où on est.
C'est une méthode que je prévois d'envisager.
05/12/2007, 15h35
SpaceFrog

y'a pas de hasFocus en javascript ... :(
05/12/2007, 16h53
troumad

Citation:

Envoyé par SpaceFrog

y'a pas de hasFocus en javascript ... :(

Bon, et bien dans ce cas, je suis sûr que mon problème est insolvable comme je comptais le faire !
Malgrès ceci, je vais mettre une balise :resolu: :(

Partie sur toutes les pages :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<script type="text/JavaScript">
//<![CDATA[
//document.onkeypress=mafonction;
 suivant=0;
 clef=new Array();
 
 function va_suivant(e)
 {
  if (window.event) {e=event;} // IE
  if (clef.inArray(e.keyCode))
   document.forms[0].elements[suivant].focus();
 }//]]>
</script>
 </head>
 <body onkeypress="javascript:va_suivant(event);">

Partie insérée sur la page qui en a besoin :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
clef[0]=13;
suivant=0;
 
//]]>
</script>
<tr>
 <td><input type='text' name='nom' size='10' onfocus="suivant=this.form.elements.length-6;" onvalue='<? echo $entree_POST['nom'] ?>'/></td>
 <td><input type='text' name='lire' size='2' onfocus="suivant=this.form.elements.length-5;" value='<? echo $entree_POST['lire'] ?>' /></td>
 <td><input type='text' size='10' onfocus="suivant=this.form.elements.length-4;;" name='mdp' /></td>
 <td><textarea name='module' rows='2' cols='45' value='<? echo $entree_POST['module'] ?>' onfocus="suivant=this.form.elements.length-1;" /></textarea></td>
 <td><input type='radio' name='choix' value='in_' /></td>
 <td>&nbsp;</td></tr>
</table>
<p><input type='button' onclick='this.form.submit()' value="envoyer" />&nbsp;<input type="reset" name ="neuf" value="Annuler" /></p>
</form>