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

jQuery Discussion :

Un alert bien bavard


Sujet :

jQuery

  1. #1
    Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    septembre 2011
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : septembre 2011
    Messages : 4
    Points : 3
    Points
    3
    Par défaut Un alert bien bavard
    Bonjour,

    voilà quelques jours que je développe mon site à l'aide de jQuery, et malgré un bon fonctionnement général, je coince sur un problème peut-être simple.

    Lorsqu'un utilisateur veut s'inscrire, une fonction jQuery est appelée, vérifiant une première fois les données et surtout l'acceptation des cgu (php le fait aussi derrière, on est jamais sûr avec un code côté client ). Lorsque que cette dernière n'est pas acceptée, la fonction alert est appelée pour prévenir l'utilisateur. Seulement voilà, ce alert, seul dans la fonction, va apparaitre pas moins de 8 fois ! J'ai fait un alert à l'appel de la fonction, et celle ci est bien appelée qu'une seule fois...

    Je suis donc sans réponse, à un problème qui va peut-être paraitre simple à certains ^^

    VOici un extrait du code :

    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
    $('#boutonValider').click(function() {
    		alert('hello');
    		$('.validation').fadeOut(100, function() {
    			$('.validation').empty();
    			var validation = 1;
    			if ($('#checkboxCgu:checked').length == 1) {
                                    // On vérifie le tout et envoi via Ajax
    			}
    			else {
    				alert('Vous devez accepter les CGU pour pouvoir vous inscrire !');
    			}
    			return false;
    		});
    		return false;
    	});
    Et le HTML correspondant :
    Code html : 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
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    <div id='inscription'>
    	<div id='titrePage'>Inscription</div>
    	<form action='' method='POST' name='FrmInscription' id='FrmInscription'>
    		<div id='account'>
    			<div class='validation' id='validationAccountName'></div>
    			<div class='entree'>
    				<label for='accountName'>Nom de compte </label><input type='text' name='accountName' class='accountName'/>
    			</div>
    			<div class='validation' id='validationAccountPass'></div>
    			<div class='entree'>
    				<label for='accountPass'>Mot de passe </label><input type='text' name='accountPass' class='accountPass'/>
    			</div>
    			<div class='validation' id='validationAccountPass2'></div>
    			<div class='entree'>
    				<label for='accountPass2'>Répéter mot de passe </label><input type='text' name='accountPass2' class='accountPass2'/>
    			</div>
    			<div class='validation' id='validationEmail'></div>
    			<div class='entree'>
    				<label for='email'>E-mail </label><input type='text' name='email' class='email'/>
    			</div>
    			<div class='validation' id='validationEmail2'></div>
    			<div class='entree'>
    				<label for='email2'>Répéter E-mail </label><input type='text' name='email2' class='email2'/>
    			</div>
    		</div>
     
    		<div id='gameInfo'>
    			<div class='validation' id='validationPseudo'></div>
    			<div class='entree'>
    				<label for='pseudo'>Nom de personnage </label><input type='text' name='pseudo' class='pseudo'/>
    			</div>
    			<div class='validation' id='validationSexe'></div>
    			<div class='entreeSexe'>
    				<label for='sexe'>Sexe </label>	<div class='input'>
    													<input type='radio' name='sexe' value='M' class='sexe'/> Homme
    													<input type='radio' name='sexe' value='F' class='sexe'/> Femme
    												</div>
    			</div>
    		</div>
     
    		<div id='cgu'>
    			<?php include('cgu.html'); ?>
    		</div>
    		<div id='cguOk'>
    			<input type='checkbox' id='checkboxCgu' name='cgu'/><label id='labelCgu' for='cgu'>Je certifie avoir lu et m'engage à respecter ces conditions</label>
    		</div>
     
    		<div id='valider'>
    			<input type='button' value='' name='valider' id='boutonValider'/>
    		</div>
    	</form>
    </div>

    Merci d'avance pour votre aide

  2. #2
    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 032
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 72
    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 032
    Points : 65 482
    Points
    65 482
    Billets dans le blog
    1
    Par défaut
    Il faudrait que l'on puisse voir le html associé, et en particulier les elements avec leur class et leur id
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

    réalisations :www.oxygen-translations.fr|www.saftair.fr| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

  3. #3
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 71
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : février 2009
    Messages : 6 389
    Points : 23 537
    Points
    23 537
    Billets dans le blog
    124
    Par défaut
    Je pense que si alert('Vous devez accepter les CGU pour pouvoir vous inscrire !'); est affiché 8 fois c'est que if ($('#checkboxCgu:checked').length == 1) { est 8 fois "false" et qu'il y a 8 éléments ayant la classe validation : $('.validation').fadeOut(100, function() {.

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  4. #4
    Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    septembre 2011
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : septembre 2011
    Messages : 4
    Points : 3
    Points
    3
    Par défaut
    Bonjour,

    oui, j'en oublie un point important : à quoi se réfère le js ^^

    Voici :
    Code html : 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
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    <div id='inscription'>
    	<div id='titrePage'>Inscription</div>
    	<form action='' method='POST' name='FrmInscription' id='FrmInscription'>
    		<div id='account'>
    			<div class='validation' id='validationAccountName'></div>
    			<div class='entree'>
    				<label for='accountName'>Nom de compte </label><input type='text' name='accountName' class='accountName'/>
    			</div>
    			<div class='validation' id='validationAccountPass'></div>
    			<div class='entree'>
    				<label for='accountPass'>Mot de passe </label><input type='text' name='accountPass' class='accountPass'/>
    			</div>
    			<div class='validation' id='validationAccountPass2'></div>
    			<div class='entree'>
    				<label for='accountPass2'>Répéter mot de passe </label><input type='text' name='accountPass2' class='accountPass2'/>
    			</div>
    			<div class='validation' id='validationEmail'></div>
    			<div class='entree'>
    				<label for='email'>E-mail </label><input type='text' name='email' class='email'/>
    			</div>
    			<div class='validation' id='validationEmail2'></div>
    			<div class='entree'>
    				<label for='email2'>Répéter E-mail </label><input type='text' name='email2' class='email2'/>
    			</div>
    		</div>
     
    		<div id='gameInfo'>
    			<div class='validation' id='validationPseudo'></div>
    			<div class='entree'>
    				<label for='pseudo'>Nom de personnage </label><input type='text' name='pseudo' class='pseudo'/>
    			</div>
    			<div class='validation' id='validationSexe'></div>
    			<div class='entreeSexe'>
    				<label for='sexe'>Sexe </label>	<div class='input'>
    													<input type='radio' name='sexe' value='M' class='sexe'/> Homme
    													<input type='radio' name='sexe' value='F' class='sexe'/> Femme
    												</div>
    			</div>
    		</div>
     
    		<div id='cgu'>
    			<?php include('cgu.html'); ?>
    		</div>
    		<div id='cguOk'>
    			<input type='checkbox' id='checkboxCgu' name='cgu'/><label id='labelCgu' for='cgu'>Je certifie avoir lu et m'engage à respecter ces conditions</label>
    		</div>
     
    		<div id='valider'>
    			<input type='button' value='' name='valider' id='boutonValider'/>
    		</div>
    	</form>
    </div>

    le checkbox incriminé est bien unique, mais j'ai compris ce que tu voulais dire danielhagou. Cependant, dans la logique procédurale, une fois la condition effectuée, on y reviens plus sans faire une boucle ou appeler une nouvelle fois la fonction, je me trompe ? En quoi le fait qu'il y ai 8 champs fasse faire au js 8 fois la condition des CGU ?
    Ok, je crois comprendre... Il va appliquer un à un le fadeOut aux blocs de classe .validation et fera à chaque fois le test du check du CGU... Hum, quelque chose ne me parait pas clair ^^

  5. #5
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 51
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : juin 2008
    Messages : 23 647
    Points : 91 423
    Points
    91 423
    Billets dans le blog
    20
    Par défaut
    Si, Daniel a raison.
    Dans ton code, tu indiques une action à effectuer lors du clic sur $('#boutonValider').
    Or dans cette action, tu demandes
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $('.validation').fadeOut(100, function() {...})
    et cette partie de code va donc être exécutée pour tous les éléments ayant la classe "validation", d'où tes huit messages.
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  6. #6
    Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    septembre 2011
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : septembre 2011
    Messages : 4
    Points : 3
    Points
    3
    Par défaut
    En effet... J'ai donc changé l'appel de fonction en
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $('.validation').empty().hide();
    , ce qui fait que la suite ne se fait qu'une fois ensuite.

    Un problème qui a du me crever la yeux au vu de la solution

    Bon, théoriquement, tout est rentré dans l'ordre ^^ Merci à vous !

Discussions similaires

  1. Comment bien déboguer son code ?
    Par D[r]eadLock dans le forum Débuter
    Réponses: 46
    Dernier message: 04/07/2013, 11h48
  2. Programmer encore en VB 6 c'est pas bien ? Pourquoi ?
    Par Nektanebos dans le forum Débats sur le développement - Le Best Of
    Réponses: 85
    Dernier message: 10/03/2009, 15h43
  3. [mise en page] pour bien indenter son code
    Par bihorece dans le forum C++Builder
    Réponses: 4
    Dernier message: 06/08/2003, 17h14
  4. Comment bien gerer la mémoire avec les TStringList?
    Par david_chardonnet dans le forum Langage
    Réponses: 5
    Dernier message: 18/06/2003, 10h57

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