Page 1 sur 2

Focus sur bouton/textbox

Posté : 05 mars 2008, 10:31
par mali_67
Bonjour, j'ai créer un formulaire composer d'un tableau a plusieurs colonnes.
Sur les entetes des colonnes, j'ai placer une textbox et un bouton, il me serve a faire une recherche via une requete ('select...from...where...like%..%'),
Donc j'ai en tout 7 textbox et 7 boutons recherche, mon probleme est que lorsque je rentre mes données dans une textbox, et que j'appui sur la touche "enter" de mon clavier ce n'est pas le bouton qui est en rapport avec la textbox qui s'enclenche mais un autre(toujour le même)

Je souhaite pouvoir faire en sorte que lorque je saisie des donner dans une des textbox le focus soit donner au bouton relier a cette textbox afin que je n'ai juste qu'a appuyer sur "enter"
Quelqu'un pourais m'aider

Posté : 05 mars 2008, 10:40
par d0m
Salut,

la touche enter est toujours associée au dernier bouton submit du formulaire sur lequel tu te trouves.

Je pense que tu n'as créé qu'un seul formulaire contenant tes 7 champs textes et tes 7 boutons submit.
Tu pourrais en créer autant que tu as de champs texte puisque tu as de toute façon 1 bouton submit par champ texte.
La touche enter sera alors associé au bouton submit correspondant au champ texte qui a le focus.

Posté : 05 mars 2008, 10:48
par mali_67
oui j'ai effectivement qu'un seul formulaire
mais je ne sais vraiment pas commenyt faire pour mettre plusieur form dans une seul page pourai tu me mettre sur piste par rapport a mon code
parceque j'ai pas preciser mais j'ai aussi 2 autre bouton + et - pour le trie voici le code de mes entetes
<form name='Form1' method="POST" action="Accueil.php?page=<?php echo $page?>" >
<table id= "Table" width= 50% >
<table border=1 align="center" cellpadding="0" cellspacing="0">
 
<tr> 
<th>Modifier</th>
<th>Supprimer</th>
<th>Verifier<br><br>Tous&nbsp;<input type='checkbox'  value="checkbox" onclick="CheckAllBox(this.checked);" /></th>

<th>Partenaire<br><input name='Submit1' type='Submit' value="+">&nbsp;<input name='Submit2' type='Submit' value="-"><br><br>
<input name='Text1' type='Text'/>&nbsp;<input id ="un" name='Submit15' type='Submit' value="GO"></th>

<th>Page Sprice<br><input name='Submit3' type='Submit' value="+">&nbsp;<input name='Submit4' type='Submit' value="-"><br><br>
<input name='Text2' type='Text'/>&nbsp;<input id ="deux" name='Submit16' type='Submit' value="GO"></th>

<th>Code du lien<br><input name='Submit5' type='Submit' value="+">&nbsp;<input name='Submit6' type='Submit' value="-"><br><br>
<input name='Text3' type='Text'/>&nbsp;<input id ="trois" name='Submit17' type='Submit' value="GO"></th>

<th>Page partenaire<br><input name='Submit7' type='Submit' value="+">&nbsp;<input name='Submit8' type='Submit' value="-"><br><br>
<input name='Text4' type='Text'/>&nbsp;<input id ="quatre" name='Submit18' type='Submit' value="GO"></th>

<th>Code du lien<br><input name='Submit9' type='Submit' value="+">&nbsp;<input name='Submit10' type='Submit' value="-"><br><br>
<input name='Text5' type='Text'/>&nbsp;<input id ="cinq" name='Submit19' type='Submit' value="GO"></th>

<th>Contact<br><input name='Submit11' type='Submit' value="+">&nbsp;<input name='Submit12' type='Submit' value="-"><br><br>
<input name='Text6' type='Text'/>&nbsp;<input id ="six" name='Submit20' type='Submit' value="GO"></th>

<th>Commentaire<br><input name='Submit13' type='Submit' value="+">&nbsp;<input name='Submit14' type='Submit' value="-"><br><br>
<<input name='Text7' type='Text'/>&nbsp;<input id ="sept" name='Submit21' type='Submit' value="GO"></th>
</tr>

Posté : 05 mars 2008, 10:53
par Ryle
Modération :
Afin d'obtenir plus de réponses, le sujet est déplacé dans le forum "Javascript, AJAX".

Posté : 05 mars 2008, 11:04
par d0m
Il suffit d'enlever ton formulaire
<form name='Form1' method="POST" action="Accueil.php?page=<?php echo $page?>" >
et de placer un formulaire de même type autour de chacun de tes groupe en pranant soin de nommer tes formulaire différemment, par exmple avec un numéro ou le nom de groupe.

Une bonne idée pour y voir plus clair lors de ton codage est de nommer test boutons submit avec un nom plus explicite :
<form name="form_1" method="POST" action="Accueil.php?page=<?php echo $page?>" >
  <th>Partenaire<br><input name='plus_1' type='Submit' value="+">&nbsp;<input name='moins_1' type='Submit' value="-"><br><br>
  <input name='Text_1' type='Text'/>&nbsp;<input id ="un" name='go_1' type='Submit' value="GO"></th>
</form>
Modération :
Afin d'obtenir plus de réponses, le sujet est déplacé dans le forum "Javascript, AJAX".
C'est pas du javascript, c'est plutôt du html.

Posté : 05 mars 2008, 11:17
par mali_67
sa fonctionne pas tout a fait comme prevu(le focus ce place sur le bouton +),
et je ne crois pas pouvoir utiliser cette méthode car lorsque j'ai mis les 7 formulaire différent et que j'ai tester, la fonctionnaliter de ma page étais chambouler (certaine fonction ne marche plus) :?

Posté : 05 mars 2008, 11:30
par d0m
Dans ce cas, tu peux carrément faire un formulaire pour le bouton + et -
et un autre pour seulement le champ texte et le bouton Go
<form name="form_plus_moins_1" method="POST" action="Accueil.php?page=<?php echo $page?>" >
  <th>Partenaire<br><input name='plus_1' type='Submit' value="+">&nbsp;<input name='moins_1' type='Submit' value="-"><br><br>
</form>
<form name="form_go_1" method="POST" action="Accueil.php?page=<?php echo $page?>" >
  <input name='Text_1' type='Text'/>&nbsp;<input id ="un" name='go_1' type='Submit' value="GO"></th>
</form>
Bien sur il va falloir adapter un peu ton code PHP de traitement qui va avec mais ça résoudra ton problème sans passer par du javascript et sera plus accessible.

Posté : 05 mars 2008, 11:49
par mali_67
une petite question encor mon formulaire principale
le <form name='Form1' method="POST" action="Accueil.php?page=<?php echo $page?>" >
je doit le fermer avant d'ouvrir les autre ou bien je laisse tel quel du genre
<form name='Form1' method="POST" action="Accueil.php?page=<?php echo $page?>" >
........
.......
<form name="form_plus_moins_1" method="POST" action="Accueil.php?page=<?php echo $page?>" > 
  <th>Partenaire<br><input name='plus_1' type='Submit' value="+">&nbsp;<input name='moins_1' type='Submit' value="-"><br><br> 
</form>
........
........
</form>

Posté : 05 mars 2008, 12:00
par Ryle
@mali_67 : effectivement, les formulaires ne doivent pas (ne peuven pas d'ailleurs) être imbriqués. Chaque formulaire ouvert doit être fermé avant de passer aux suivants afin que leurs inputs ne soient pas mélangés.
Par ailleurs, ils ne doivent pas être placés n'importe où dans ton tableau. Ainsi, tu ne peux pas (tout du moins ne devrais pas) en glisser entre une balise <table> et une balise <tr> ou entre <tr> et <th>/<td>... Du coup il ne faut pas que les champs du formulaire se trouvent dans plusieurs cellules...

@d0m : euh.. oui... certes.. on doit pouvoir faire ça qu'avec du html... mais entre 20 formulaires dans un code qui sera illisible et difficilement maintenable ou une bête fonction javascript de 3 lignes qui soumettra les données correctement en fonction du bouton cliqué, j'ai tendance à négliger les 4 ou 5 parano du javascript qui viendraient sur mon site ;) (et avec l'essort d'Ajax, la proportion de gens et de navigateurs qui n'utilisent pas js est plus que négligeable... je sais, c'est mal, mais quand même... :))

Posté : 05 mars 2008, 12:06
par mali_67
Alors a se que j'ai compris il vaut mieu utiliser du javascript?
mais je ne sais quand même pas comment faire je vais deja essayer de rajouter des formulaire
j'éspere que sa va marché :?

JE VIEN DE TESTER si je mets plusieur formulaire ma page ne fonctionne plus trés bien

Posté : 05 mars 2008, 12:19
par d0m
En utilisant du javascript, il faut intercepter l'événement de la touche Entrée lorsque tu es sur un champ texte et soumettre le formulaire :
<input name='Text_1' type='Text' onKeyDown="appuieTouche(1,this.form);"/>
et la fonction javascript :

Code : Tout sélectionner

appuieTouche(numTexte,formulaire){ //vérification de la touche enfoncée par son code ascii var touche = event.keyCode; if((touche==10) || (touche==13)){ formulaire.submit(); } }
Si tu as un seul formulaire pour tout, il faut également préciser (par un champ hidden par exemple contenant le numéro du groupe) quel champ vient d'être rempli.

Posté : 05 mars 2008, 12:41
par mali_67
:( sa ne fonction j'ai peut-etre mal utilisier, j'ai fait comme ta ecrit juste sur ma premiere textbox pour voir mais sa ne fontionne pas

Posté : 05 mars 2008, 12:44
par d0m
C'est à dire? quels sont les erreurs javascript? as tu mis des alert() pour voir si les conditions sont remplis, etc ?

Posté : 05 mars 2008, 15:14
par mali_67
il n'y a pas d'erreur en faite il n'y a rien qui change le focus reste juste sur le premier bouton de mon formulaire, pas fait d'alert ou autre
je comprend pas bien le code :(

regarder se qu'on vien de m'envoyer
http://fashion.hosmoz.net/post/2006/10/ ... laire-HTML
c pas vrai? :?

Posté : 05 mars 2008, 16:08
par d0m
Effectivement c'est comme ça.

Mais avec un seul formulaire, il faut obligatoirement utiliser du javascript en interceptant la touche entrée.

L'idée est que lorsqu'on est sur un champ texte et qu'on appuie sur entrée,
ce n'est pas le bouton qui est utilisé mais le formulaire soumis directement comme si on avait appuyé sur n'importe quel bouton submit.

Il va donc falloir savoir sur lequel de tes champs texte tu étais lorsque le formulaire a été soumis.

Tu peux mettre un champ caché initialisé à 0 dans ce formulaire :

Code : Tout sélectionner

<INPUT TYPE="hidden" NAME="quel_champ_texte" VALUE="0">
la fonction javascript d'interception de touche, avant de soumettre le formulaire, doit changer la valeur de ce champ caché par le numero du champ texte qu'on vient de remplir.

Et dans ton code PHP de traitement, tu dois tester avant tout si la valeur de ce champ caché est supérieur à 0.
Si c'est le cas c'est qu'on vient d'appuyer sur la touche entrée et tu dois suivant la valeur i du champ faire le même traitement que si tu avais appuyé sur le bouton submit i.

Sinon que ne comprends tu pas dans la fonction javascript?