Détecter ENTER dans un formulaire

Détecter ENTER dans un formulaire - HTML/CSS - Programmation

Marsh Posté le 14-09-2008 à 13:47:01    

Bonjour, j'aimerai savoir si mon formulaire a été soumis après avoir cliqué sur le bouton ou bien lorsque Enter a été pressé sur le 1er champ. En effet, je ne souhaite pas que ce formulaire soit soumis par Enter (car dans la réalité je ne souhaite pas soumettre ce formulaire mais uniquement transmettre des valeurs à un autre formulaire qui lui sera soumis... un peu compliquer à expliquer comme ça...). Bref, mon exemple ne fonctionne pas, la fonction js affiche toujours 'ok' !
Merci d'avance !
 

Code :
  1. <script language="javascript">
  2. function mySubmit(){
  3.  if(window.event.keyCode!=13) document.write("ok" );
  4. }
  5. </script>
  6. <form onsubmit="mySubmit()">
  7. Field1: <input type="text"/><br />
  8. Filed2: <textarea></textarea><br />
  9. <input type="submit" value="Envoyer"/>
  10. </form>


Message édité par malicious le 14-09-2008 à 13:52:42
Reply

Marsh Posté le 14-09-2008 à 13:47:01   

Reply

Marsh Posté le 14-09-2008 à 14:20:47    

1-Vire le submit et remplace le par un button (si js activé)
2-utilise form.submit sur le onclick du button
 
EDIT merde çà à l'air de passer quand même...


Message édité par Profil supprimé le 14-09-2008 à 14:25:31
Reply

Marsh Posté le 14-09-2008 à 14:23:25    

Quelle différence entre cliquer et taper entrée ? Dans tous les cas du point de vue du protocole c'est la même chose, des données sont envoyées et pis c'est tout

Reply

Marsh Posté le 14-09-2008 à 15:00:45    

bonjour,
 
enlever le bouton submit
 
<form action="javascript:alert('envoyé');">
 <input type="text" />
 <input type="text" />
 <input type="button"  
  onclick="this.form.submit();"/>
</form>
 
tester enter :
 
<script type="text/javascript">
    function ctrTch(event)
    {  if ( event.which==13 )
            return false;    
       if ( event.keyCode==13 )
            event.returnValue = false;
    }
</script>
 
<form action="javascript:alert('envoyé');"
 onkeypress= "return(ctrTch(event));">
 <input type="text" />
 <input type="text" />
 <input type="submit" />
</form>
 
mais franchement : vaudrait mieux voir les choses autrement....
supposons un utilisateur qui n'autorise pas le javascript......
 
@+


Message édité par bul3 le 14-09-2008 à 15:03:20

---------------
[mon site] [m'écrire]
Reply

Marsh Posté le 14-09-2008 à 16:47:19    

Merci bul3, c'est vrai que c'est assez compliqué juste pour empêcher Enter... je testerai ta solution et sinon j'essaierai de voir comment contourner mon problème. A part ça, un utilisateur qui n'autorise par js ne pourra pas non plus surfer sur bcp de sites.

Reply

Marsh Posté le 14-09-2008 à 16:49:49    

Toute cette histoire reste louche :/ Si on appuie sur entrée, c'est comme si on avait cliqué [:petrus dei]

Reply

Marsh Posté le 14-09-2008 à 17:14:08    

Non justement... pourquoi je veux bloquer Enter :
 
Mon formulaire contient un bouton "button" et non pas "submit" car j'appelle une fonction JS qui récupère les valeurs des champs pour compléter un autre formulaire qui lui sera soumis... Le problème est que si Enter est appuyé dans le champ Text, ce n'est plus ma fonction qui sera appelé mais ce formulaire qui sera soumis.  
Donc s'il existe une autre solution que de bloquer Enter, je suis preneur, je n'ai rien contre lui :)) Il faudrait que si Enter est enfoncé, ma fonction soit aussi appelé. Est-ce faisable ?
 
Edit: Normalement, si j'ajoute onSubmit="maFonction" dans Form ça devrait marcher... je vais essayer


Message édité par malicious le 14-09-2008 à 17:22:40
Reply

Marsh Posté le 14-09-2008 à 17:22:49    

le onsubmit doit retourner False.

Reply

Marsh Posté le 14-09-2008 à 17:30:42    

>>un utilisateur qui n'autorise par js ne pourra pas non plus surfer sur bcp de sites.  
le % de ceux qui refusent le js est > à celui des internautes qui  
utilisent certains navigateurs ( pourtant superbes ! )
il faut quand même prévoir une solution de repli
entre <noscript> et </noscript>
@+


---------------
[mon site] [m'écrire]
Reply

Marsh Posté le 14-09-2008 à 17:34:08    

>>Le problème est que si Enter est appuyé dans le champ Text,  
>>ce n'est plus ma fonction qui sera appelé mais ce  
>>formulaire qui sera soumis.
met un bouton submit...  
enter n'envoie le formulaire que si le focus est
sur ce bouton je pense... ( à vérifier )
peut-être aussi, gérer les onblur sur les champs...
 
EDIT : comme dit KangOI,
retourner false dans le onsubmit évite d'envoyer le formulaire
 
trait() {... return false; }...
<form... onsubmit=return(trait());"...>
...
 
@+


Message édité par bul3 le 14-09-2008 à 17:40:05

---------------
[mon site] [m'écrire]
Reply

Marsh Posté le 14-09-2008 à 17:34:08   

Reply

Marsh Posté le 14-09-2008 à 17:57:55    

waouh!! :)) Merci à tous!  
 
Merci bul3 pour avoir éclairci ce que KangOI voulait dire, oui ça marche ! J'ai donc écrit ça :
 

Code :
  1. <form onsubmit="return(false)">
  2. Field: <input type="text"/>
  3. <input type="button" value="Envoyer" onclick="mySubmit()"/>
  4. </form>


 
Le formulaire n'est plus soumis et à pour effet de bloquer Enter. Je pense que ça servira aussi pour bcp d'autres car c'est une question que j'ai vu sur de nombreux forums sans jamais avoir eu de véritable réponse si ce n'est "pourquoi bloquer Enter ?"

Reply

Marsh Posté le 15-09-2008 à 05:59:55    

malicious a écrit :

waouh!! :)) Merci à tous!  
 
Merci bul3 pour avoir éclairci ce que KangOI voulait dire, oui ça marche ! J'ai donc écrit ça :
 

Code :
  1. <form onsubmit="return(false)">
  2. Field: <input type="text"/>
  3. <input type="button" value="Envoyer" onclick="mySubmit()"/>
  4. </form>


 
Le formulaire n'est plus soumis et à pour effet de bloquer Enter. Je pense que ça servira aussi pour bcp d'autres car c'est une question que j'ai vu sur de nombreux forums sans jamais avoir eu de véritable réponse si ce n'est "pourquoi bloquer Enter ?"


 
 
 
Mais nan bande de têtes à claque, la réelle solution est de conserver le comportement du submit, mais de lancer la fonction de récupération de tous les cacas autour depuis l'événement onsubmit du formulaire.

Code :
  1. <form onsubmit="return allChampsOk();">
  2. Field: <input type="text"/>
  3. <input type="submit" value="Envoyer" />
  4. </form>


 
et ta fonction allChampsOk() est celle qui récupère les valeurs, elle renvoi soit true pour dire "j'ai tout recupérer et aucun champ et pourri", soit false pour dire "j'ai une erruer j'envoi rien (dans le cas ou l'utilisateur aurait oublié de remplir un champ.)).
 
Mais arrêtez avec vos button [:mlc]
 
Et puis en lisant ce que tu dis, je me demande réellement pourquoi tu as 2 formulaire. ton petit formulaire dois être dans une popup car sinon je ne verrais pas d'aute explication.
 
Autre chose. Si c'est un admin, tu as le droit de faire ce que tu est en train de bricoler. Mais si c'est pour un site web, tu es juste en train de faire de la merde.

Reply

Sujets relatifs:

Leave a Replay

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