IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Validation d'un formulaire par le bouton entrée !


Sujet :

JavaScript

  1. #1
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Janvier 2006
    Messages
    115
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2006
    Messages : 115
    Points : 68
    Points
    68
    Par défaut Validation d'un formulaire par le bouton entrée !
    Bonjour à tous,

    Je souhaiterai empêcher la validation d'un formulaire par le bouton enter, excepté lorsque le bouton est sélectionné par navigation du curseur à l'aide du clavier (touche Tab).
    Pour désactiver la validation du bouton "Enter", j'ai simplement rajouté la ligne :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <form action="" id="" method="post" onkeypress="if(event.keyCode == 13) return false;">
    Il me reste donc la problématique de la validation du formulaire par la touche Enter dans le cas d'une personne ne se servant pas de sa souris.
    Par ailleurs, mes boutons sont de type Submit, et je n'ai pas la possibilité de changer de type.

    Merci d'avance pour votre aide.

  2. #2
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 915
    Points
    79 915
    Par défaut
    Bonjour,

    Peut-être qu'au onfocus du bouton, il faut changer le onkeypress du formulaire ?

  3. #3
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Janvier 2006
    Messages
    115
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2006
    Messages : 115
    Points : 68
    Points
    68
    Par défaut
    C'est à dire ? J'ai bien peur de ne pas te suivre...

    Je dois rajouter un événement onFocus sur mon bouton ? J'ai essayé, mais cela ne mène à rien...
    Grosso modo, il faudrait que je rajoute une condition && dans ma balise form pour savoir si il y a focus sur mon bouton, mais là, je ne sais pas faire...

    Merci pour ta réponse.

  4. #4
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 915
    Points
    79 915
    Par défaut
    C'était peut-etre pas le onfocus mais le onblur ou bien le onselect ?
    Si on arrive sur le bouton, il faut lancer une fonction Javascript qui va mettre à jour le onkeypress du formulaire pour enlever le return false.
    Seulement, il faudra le remettre si on quitte le bouton.

  5. #5
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 642
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 642
    Points : 66 668
    Points
    66 668
    Billets dans le blog
    1
    Par défaut
    sinon enlève le bouton submit et remplace le par un input type button
    avec dans son onclick:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    onclick=" if(this.form.onsubmit){this.form.submit()}"

  6. #6
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 915
    Points
    79 915
    Par défaut
    Sous réserve:

    Citation Envoyé par Le Mad Voir le message
    Par ailleurs, mes boutons sont de type Submit, et je n'ai pas la possibilité de changer de type.

  7. #7
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Janvier 2006
    Messages
    115
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2006
    Messages : 115
    Points : 68
    Points
    68
    Par défaut
    La solution de Spacefrog est la meilleure qui soit, merci à lui.

  8. #8
    Nouveau membre du Club
    Inscrit en
    Novembre 2009
    Messages
    27
    Détails du profil
    Informations forums :
    Inscription : Novembre 2009
    Messages : 27
    Points : 31
    Points
    31
    Par défaut
    Si tu veux absolument garder ton input de type submit, je ne vois que ça
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    29
    30
    31
    32
     
                    <form id="monForm" action="http://developpez.com">
    			<input type="text" name="param"/>
    			<br/>
    			<input type="submit" onfocus="setIsFocused()" onblur="setIsNotFocused()" value="soumettre" onclick="forceSubmit();"/>
    		</form>
     
    		<script>
     
    			var isBtnFocused = false;
     
    			function setIsFocused(){
    				isBtnFocused = true;
    			}
    			function setIsNotFocused(){
    				isBtnFocused = false;
    			}
     
    			function forceSubmit(){
    				if(isBtnFocused)
    					document.getElementById("monForm").submit();
    			}
     
    			function init(){
    				var form = document.getElementById("monForm");
    				form.onsubmit = function(e){
    					e.preventDefault();
    				};
    			}
    			init();
     
    		</script>
    Pis bah sinon c'est clair qu'utiliser un type button plutôt qu'un submit règle le problème plus simplement !

  9. #9
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Janvier 2006
    Messages
    115
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2006
    Messages : 115
    Points : 68
    Points
    68
    Par défaut
    Bonjour à tous,

    Alors, j'ai enlevé le tag "Résolu" pour la simple et bonne raison que la solution de SpaceFrog ne marche que sur un seul de mes formulaires. En effet, je dois appliquer cette politique à 3 formulaire.

    Pour les deux autres, il m'est impossible avec cette solution de valider le formulaire par le bouton entrée et même par click !!!
    Cependant, si je simplifie ta solution par :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <input type="button" ..... onclick="this.form.submit()"/>
    J'obtiens bien un résultat, mais qui ne convient pas, les tests ajax de validation n'étant pas traités.

    julioooo, j'ai testé ta proposition, mais elle ne fonctionne pas, merci tout de même pour ton aide.

    A bientôt.

  10. #10
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 915
    Points
    79 915
    Par défaut
    A la place du submit, appelez votre fonction Ajax et mettez le submit dans la fonction retour de la fonction Ajax.

  11. #11
    Nouveau membre du Club
    Inscrit en
    Novembre 2009
    Messages
    27
    Détails du profil
    Informations forums :
    Inscription : Novembre 2009
    Messages : 27
    Points : 31
    Points
    31
    Par défaut
    Salut à vous !

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    function init(){
    	var form = document.getElementById("monForm");
    	form.onsubmit = function(e){
    		var event = e || window.event;
    		if (event.preventDefault) {
    			event.preventDefault();  // FF
    		}
    		event.returnValue = false;  // IE
    	};
    }
    Le Mad j'avais pas essayé sous IE , j'ai retrouvé un pti bout de code sur le forum et la c'est bueno, essayes en remplaçant la fonction init() par celle la !

  12. #12
    Membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Janvier 2006
    Messages
    115
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2006
    Messages : 115
    Points : 68
    Points
    68
    Par défaut
    julioooo, ton script ne répond pas à mes attentes, le formulaire est tout de même validé sans vérification.

    vermine, j'ai utilisé ce que tu m'as dit, soit :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <input type="button" id="validSendCourrier" value="Valider"  class="btnform155v" onclick="validateSendCourrier()"/>
    Et cela marche parfaitement, merci à tous pour votre aide.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Exécuter vba + ouvrir formulaire par un bouton
    Par leeloo35 dans le forum VBA Access
    Réponses: 2
    Dernier message: 28/01/2008, 19h48
  2. validation d'un formulaire par la touche entree
    Par crocodingo dans le forum Servlets/JSP
    Réponses: 4
    Dernier message: 05/10/2007, 16h40
  3. [HTML] Validation d'un formulaire par entrée mais sans bouton type submit
    Par legillou dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 04/06/2007, 17h40
  4. Gestion des évenements lors de la validation par le bouton entrée
    Par rattlehead dans le forum Windows Forms
    Réponses: 2
    Dernier message: 26/12/2006, 16h24
  5. Empecher la validation d'un formulaire par entrée
    Par Oluha dans le forum Général JavaScript
    Réponses: 12
    Dernier message: 15/09/2006, 13h39

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo