La touche enter submit un formulaire avec plusieurs input text

Bonjour,

Dans mon intranet, j'ai un truc qui me bloque sans trouver de réponse.

J'ai sur une page un formulaire constitué de plusieurs input type="text",
normalement, le navigateur ne devrait pas faire de submit lorsque l'utilisateur utilise la touche entrée, mais pourtant c'est ce qui se passe (avec FF et IE).

Je me suis dit : c'est le input type="submit", ok je le remplace par un
input type="button" onClick="submit();"
ça le change sur une page, mais pas sur une autre, ou cette partie est rigoureusement identique.

Comment on peut autoriser ou interdire le submit avec la touche entrée ?

A d'autres endroits, si les champs sont obligatoire, ça ne pose pas de problème, mais ici les champs ne sont pas obligatoires, il faut juste éviter de valider des formulaires incoplèts.

mon code:
[code]
<h1>Inscrire</h1><div class="blocsaisie">
<input name="NUMSTAGE" value="64" type="hidden"> <table><tbody>
<tr><td> </td><td>&nbsp;Nom patronymique&nbsp;</td><td>&nbsp;Nom marital&nbsp;</td><td>&nbsp;Prénom&nbsp;</td><td>&nbsp;Date de nais.&nbsp;</td></tr>

<tr><td><select name="CIV" size="1" class="ptiote"><option>M</option><option>Mme</option><option>Mlle</option></select></td><td><acronym title="Nom patronymique"><input name="PATRO" size="30" class="ptiote" type="text"></acronym></td><td><acronym title="Nom marital"><input name="MARITAL" size="30" class="ptiote" type="text"></acronym></td><td><acronym title="Prénom"><input name="PRENOM" size="30" class="ptiote" type="text"></acronym></td><td><acronym title="Date de naissance"><input name="DTNAISS" size="8" class="ptiote" type="text"></acronym>
</td></tr><tr><td>Adresse:</td><td><input name="ADRESSE1" size="30" class="ptiote" type="text"></td><td><input name="ADRESSE2" size="30" class="ptiote" type="text"></td><td><acronym title="Code postal"><input name="CP" size="5" class="ptiote" type="text"><acronym title="Ville"><input name="VILLE" size="21" class="ptiote" type="text"></acronym></acronym></td><td><acronym title="téléphone">Tél:<input size="10" name="TELEPHONE" class="ptiote" type="text"></acronym></td></tr><tr><td>Projet:</td><td colspan="3"><input size="65" name="PROJET" class="ptiote" type="text"></td><td><input name="ajout" value="y" type="hidden"><input value="Ajouter" name="bt_ajout" onclick="submit();" type="button"></td></tr></tbody></table></div>

Bonjour,
pourquoi voudrais-tu interdire un comportement tout à fait habituel et normal ?
Pour embrouiller tes utilisateurs ?

Je sais comment on fait, mais.... je veux d'abord savoir.

En effet, c'est possible. Pour ma part, je laisse les utilisateurs appuyer sur la touche Entrée dans les champs pour soumettre le formulaire, mais pour éviter les erreurs, par exemple un utilisateur qui accroche le bouton Entrée, ou s'il pense qu'en appuyant sur Entrée ca passe au champ suivant, j'ajoute ceci dans l'événement du formulaire :

<form ... onsubmit="return confirm('Voulez-vous vraiment soumettre le formulaire ?')">

L'événement pourrait être déclaré dans un fichier JS externe, pour une meilleure séparation du code.

De cette façon, on ne prive pas ceux qui veulent soumettre le formulaire avec la touche entrée à partir d'un champ de saisie, et on évite à l'utilisateur de commettre une erreur.

QuentinC a écrit :
Bonjour,
pourquoi voudrais-tu interdire un comportement tout à fait habituel et normal ?
Pour embrouiller tes utilisateurs ?

Je sais comment on fait, mais.... je veux d'abord savoir.

C'est un formulaire avec plusieurs champs, non obligatoires, si bien qu'en faisant entrée, on enregistre un formulaire incomplet, et c'est ça qui embrouille mes utilisateurs.

Sylvain, ma solution ne te conviens pas ?

Depuis quand Entrée est utilisé pour passer d'un champ à l'autre ?
La touche tab n'a pas été inventée pour des prunes !

QuentinC a écrit :
Depuis quand Entrée est utilisé pour passer d'un champ à l'autre ?

Je n'ai pas dis que c'était une pratique courante, quoique je crois avoir déjà vu ca dans certains logiciels. N'oublions pas que les utilisateurs ne sont pas tous des habitués à utiliser l'informatique et par réflexe, ils peuvent bien appuyer sur Entrée après avoir tappé la valeur dans le champ, croyant que ca passerait au champ suivant. Si Sylvain recherche une solution à propos du problème lorsque les utilisateurs soumettent par erreur le formulaire, c'est que forcément, les utilisateurs font cette erreur. Ma solution tente à contenter tout le monde :

- Ceux qui veulent utiliser la fonctionnalité native du navigateur permettant de soumettre un formulaire en appuyant sur Entrée, dans n'importe quel champ.
- Ceux qui sont embrouillés lorsqu'ils appuient par erreur sur Entrée dans n'importe quel champ du formulaire et que le formulaire est soumi. (ex : l'utilisateur pense que ca passe au champ suivant, en prenant sa tasse de café il appui par accident sur Entrée, etc..)

Ma solution rend tout le monde heureux, et ca permet de demander confirmation à l'utilisateur.
Modifié par Merkel (30 Sep 2005 - 19:41)

bonjour,

Pour ma part j'ai besoin de désactiver la touche entrée car j'ai different bouton submit et l'utilisateur doit obligatoirement cliquer sur le bouton sinon s'il presse entrée le formulaire est validé et du coup aucun traitements sur mes boutons n'est effectué, la variable est alors vide et ma requete plante...

Voila je cherche la reponse alors que QuentinC à apparement la réponse mais il ne veut pas partager

--EDIT : La touche entrée active quand meme mon bouton submit en question , j'ai pu constater avec print_r($_POST); que les coordonnées étaient de 0, normal puique pas de souris, suffisait de modifier légerement mon code...
Si y a une solution pour désactiver la toucher entrée autre qu'avec JavaScript je suis preneur pour ma culture générale
Modifié par imer (17 Aug 2006 - 09:37)

Non, c'est uniquement possible avec javascript.

ok merci de ta réponse, donc si l'utilisateur désactive JS, ça réactive enter

Bonjour,

ce n'est pas un problème de désactiver telle ou telle chose.

C'est un problème de validation du formulaire lors de la soumission, "accidentelle" comme volontaire: côté client en js et côté serveur.

Bonjour,

imer a écrit :
J'ai pu constater avec print_r($_POST); que les coordonnées étaient de 0, normal puique pas de souris

Si je comprend bien, tu détermines quel submit à été utilisé grâce à la position du curseur. Si c'est la cas, je pense qu'il y a moyen de faire mieux.
Il se peut donc que tu doives mieux structurer ton code html (C'est une hypothèse; je l'ai pas lu). Dans ce cas, je me souviens de deux articles d'Openweb, qui devraient t'être utiles. Il s'agit de "Utilisation des formulaires et accessiblité" et "Bien valider ses formulaires avec Javascript".
De toute façon, même si j'ai rien compris à ton problème, ça ne fait pas de mal de lire ou relire ces deux articles.

J'espère avoir pu t'aider
Modifié par Mathieu_vd (18 Aug 2006 - 17:32)

Merci de ton aide Mathieu_vd, je détermine effectivement quel submit a été utilisé grâce à la position du curseur... Je suis donc intéresser par tes liens mais en ce moment le site openweb n'est pas accessible dommage...

La touche entrer appel la fonction 'submit' du 'form' auquel le champ dans lequel on a cliquer appartient.
Il subit de placer une fonction sur l'evenement onsubmit
Cette fonction decide ou non de revenvoyer true ou false (qui provoque oui ou non l'envoi du formulaire)

Ensuite on place un evenement 'click' sur les 2 boutons voulus qui vont appelé la fonction nommé ci-dessus. Plus besoin de determiner la position du curseur, la fonction de l'evenement click recoit l'evenement qui l'a enclenché et donc l'objet concerné...

qu'en pensez vous ?
Modifié par nORKy (23 Aug 2006 - 14:24)

Bonjour à tous.

Pour annuler la validation d'un formulaire tel qu'il soit, la solution est bien entendu le javascript.

Voilà ma méthode :

1) j'utilise la librairie Prototype disponible ici : http://www.prototypejs.org/download


2) voilà le code minimale du JS...

function init()
{
  Event.observe('nom du formulaire', 'submit', function(event) {Event.stop(event);});
}

Event.observe(window, "load", init)

Event.observe(window, "load", init) permet de s'assurer que la page est bien chargé avant de faire quoi que ce soit... IE commence l'execution du javascript avant de finir de charger les pages, ce qui risque de poser des problèmes si ton formulaire n'est pas encore dans la page...
Modifié par BatMen (08 Feb 2007 - 19:22)