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 :

Empêcher envoi multiple requêtes ajax [AJAX]


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Octobre 2009
    Messages
    29
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2009
    Messages : 29
    Par défaut Empêcher envoi multiple requêtes ajax
    Bonjour,

    Je ne comprends ni pourquoi ni comment, mais j'ai une page phtml qui fait appel à une page php par le biais de $.ajax de jQuery et parfois, mon navigateur envoie 2 requêtes, ou plus, d'un coup. Si je re-clique, ça renvoie à chaque fois les anciennes requêtes j'imagine.
    Pourtant, en cherchant sur internet, j'avais trouvé unbind, mais ça ne change rien... En ajoutant async : false, le bug se produit moins souvent.

    Voici la requête :
    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
    $('#transfer').click(function() {
    	$.ajax({
    		url: '/index/update',
    		async: false,
    		data: {
    			tid: eventId,
    			wid: '<?php echo $this->wid; ?>',
    			statut: 4
    		},
    		type: "POST",
    		success: function(responseText) {
    			// on change la couleur
    			if(event.color == "green") {
    				event.color = "darkblue";
    			} else {
    				event.color = "green";
    			}
    			$('#calendar').fullCalendar('updateEvent', event);
    			$('#transfer').unbind('click');
    		},
    		error: function(jqXHR, textStatus, errorThrown) {
    			alert('Impossible de marquer la tâche comme "transferée"');
    			$('#transfer').unbind('click');
    		}
    	})
    });
    Je précise tout de même que je ne suis pas expert en jQuery...

    Merci pour vos réponses.

  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 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    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 659
    Billets dans le blog
    1
    Par défaut
    Une des techniques les plus radicales pour prévenir de multiples click c'est de faire disparaitre le bouton le temps de l'opération

    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
    $('#transfer').click(function() {
    	me=$(this);
    	me.hide();
    	$.ajax({
    		url: '/index/update',
    		async: false,
    		data: {
    			tid: eventId,
    			wid: '<?php echo $this->wid; ?>',
    			statut: 4
    		},
    		type: "POST",
    		success: function(responseText) {
    			// on change la couleur
    			if(event.color == "green") {
    				event.color = "darkblue";
    			} else {
    				event.color = "green";
    			}
    			$('#calendar').fullCalendar('updateEvent', event);
    			me.unbind('click');
    			me.show();	
    		},
    		error: function(jqXHR, textStatus, errorThrown) {
    			alert('Impossible de marquer la tâche comme "transferée"');
    			me.unbind('click');
    			me.show();
    		}
    	})
    });
    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 !

  3. #3
    Membre averti
    Profil pro
    Inscrit en
    Octobre 2009
    Messages
    29
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2009
    Messages : 29
    Par défaut
    Merci pour cette réponse, mais en fait, ce n'est pas un problème de "double clic" étant donné que je ne clique qu'une seule et unique fois.
    De toute façon, avec l'unbind, ça empêche toute autre action.

  4. #4
    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 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    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 659
    Billets dans le blog
    1
    Par défaut
    il n'y a rien dans le bout de code montré qui declenche plusieurs envois...

    on peut vois le html du id transfer ?
    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 !

  5. #5
    Membre averti
    Profil pro
    Inscrit en
    Octobre 2009
    Messages
    29
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2009
    Messages : 29
    Par défaut
    Bah pareil, je ne comprends pas non plus...
    Pour le code de transfer, c'est un simple menu qui s'affiche lorsque l'on clique sur une div, qui fait ensuite apparaître un menu avec une balise p contenant le transfer et quand on clique, c'est censé faire le traitement ajax...

    C'est vraiment tout bête, rien de bien méchant, pour les autres ça fonctionne, mais pas pour transfer, c'est assez aléatoire en fait : tantôt ça marche, tantôt ça ne marche pas.

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    <div id="menuArea" style="position:absolute;top:0px;left:0px;Z-index:10;visibility:collapse;">
    	<ul id="menu" class="ulMenuArea">
    	    <li id="1"><p id="consult">Consulter la fiche du client</p></li>
    	    <li id="2"><p id="transfer">Transférer au groupe</p></li>
    	    <li id="3"><p id="markAsFinished">Marquer comme terminé</p></li>
    	</ul>
    </div>

    Le fait de mettre async: false permet de beaucoup moins le faire, et quand ça se produit, ça m'exécute d'abord une fois l'action et, quand elle est finie, ça relance une action... C'est à s'arracher les cheveux car pour moi le code est correct

  6. #6
    Expert confirmé

    Homme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2010
    Messages
    5 418
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Septembre 2010
    Messages : 5 418
    Par défaut
    Avec jquery il y a bien le .one qui permet de ne déclencher l'action qu'une seule fois. Mais il doit y avoir un pb ailleurs dans ton code et l'emploi de async: false est déconseillé la plupart du temps (sauf à en avoir réellement besoin mais pas pour régler ce genre de problème).
    Faut te mettre en mode debug, cad revoir et tester ton code bloc par bloc pour voir quand ça cloche.

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

Discussions similaires

  1. [AJAX] Pas de données après de multiples requêtes Ajax
    Par M4veR1K dans le forum jQuery
    Réponses: 5
    Dernier message: 23/10/2012, 17h07
  2. Réponses: 0
    Dernier message: 03/01/2012, 22h24
  3. Réponses: 0
    Dernier message: 03/08/2011, 10h23
  4. [AJAX] Envoie d'une requête AJAX
    Par tidus_6_9_2 dans le forum AJAX
    Réponses: 16
    Dernier message: 14/04/2010, 15h23
  5. [MooTools] Multiples requêtes Ajax et performances
    Par ALkyD dans le forum Bibliothèques & Frameworks
    Réponses: 3
    Dernier message: 15/01/2008, 11h11

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