Fonction appellée X fois ! à cause de l'ajax

Fermé
martine et chantal Messages postés 485 Date d'inscription dimanche 15 février 2009 Statut Membre Dernière intervention 4 juin 2013 - Modifié par martine et chantal le 3/05/2013 à 10:54
martine et chantal Messages postés 485 Date d'inscription dimanche 15 février 2009 Statut Membre Dernière intervention 4 juin 2013 - 3 mai 2013 à 18:35
Bonjour,

Voilà un bon moment que je penche sur le même problème.

Imaginons une DIV <div class="premier"></div> contenant des DIVS <div class="second"></div>
Je souhaite avoir une action javascript lors du survole des DIVS ".second"
Je déclare donc une fonction actionsecond()

Maintenant je souhaite recharger le contenu de la DIV ".premier" grâce à l'ajax
La même... le nouveau chargement contient des DIVS ".second"

Zut ! ma fonction actionsecond() ne fonctionne plus sur le nouveau contenu.
Très bien... je rappelle la actionsecond() APRES le retour ajax.
Magique ça marche ! enfin presque... la fonction est appellée 2 fois

En sachant que je désir remplir le contenu de la DIV ".premier" plusieurs fois...
la fonction actionsecond() sera appellée X fois

Quelle est la bonne procédure pour qu'une fonction soit déclarée une seule fois avec l'ajax ???

please !


A voir également:

1 réponse

Utilisateur anonyme
3 mai 2013 à 17:42
Salut,

je suis pas sûre d'avoir tout compris , vous avez quelque chose comme ça:
<div class="premier">

   <div class="second" onmouseover="actionsecond()">
   ...
   </div>
   <div class="second" onmouseover="actionsecond()">
   ...
   </div>
   ...

</div> 
 

avec la fonction javascript actionsecond() qui fait quoi??
Ensuite tu nous dis que tu souhaites recharger div .premier grâce à l'ajax: qu'est ce que tu fais exactement à ce niveau là?

Si tu renseignes l'événement onmouseover dans les div de classe second au rechargement, je ne comprends pas comment ta fonction ne marcherai plus!

As tu un peu plus de code à poster?
0
martine et chantal Messages postés 485 Date d'inscription dimanche 15 février 2009 Statut Membre Dernière intervention 4 juin 2013 4
Modifié par martine et chantal le 3/05/2013 à 18:38
Si je souhaite recharger mes div en ajax c'est pour éviter de charger une autre page.
Pour le cas actuel, je suis en train de faire un backoffice.

Lorsque je clic sur le menu j'ouvre les travaux associés : une liste de divs associées à plusieurs fonctions : déplacer / modifier / supprimer / ... (j'utilise jQuery).

Donc chaque fois que j'ouvre je clic sur un <li><a> du menu je recharge ma div conteneur.

voici un exemple précis (après avoir cliqué sur le menu) :
J'ai mis en place un système pour modifier l'ordre des travaux en glissant les divs.
visuellement la div diminue en opacité et une ligne horizontal de couleur m'indique où va apparaître ma div déplacée
=> lorsque je relache le clic .mouseup(), je recharge le contenu pour faire apparaître les divs dans le nouvel ordre.

donc :
1_ je clic sur le menu : fonction menu() = envoi ajax + retour contenu, puis je déclare la fonction deplacer()
2_ je déplace une div du contenu en gardant le clic enfoncé : c'est la fonction deplacer()
3_ je relache mon clic : tjrs la fonction deplacer()
4_ j'appelle ma fonction modifierordre() envoi ajax + retour contenu ... et c'est là que ma fonction deplacer() ne marche plus. Pourtant elle est chargé par le navigateur d'après ce que je comprends. Donc ma seule solution est de la redéclarer. la fonction deplacer() fonctionne mais appelle à son tour X fois la fonction modifierordre(); (en fonction du nombre de fois que déplace mes divs)

mon code simplifié :

function menu(){   
      $(".menu li a").click(function(){   
             // récoltes des infos nécessaires pour la page .php   
      var req = $.ajax({   
            url: 'actions/searchmenu.php',   
            type: 'POST',   
            data : {   
                  ajaxinfo : info,   
                  ajaxinfo : info,   
                  ...   
            }   
      });   
      req.done(function(msg){   
            $('.conteneur').html(msg);   
            deplacer();   
      });   
}   

function deplacer(){   
      $(".travaux").mousedown(function() {   
            // recoltes des infos du nouvel ordre   
      }).mouseup(function(){   
            // appel de la fonction modifierordre()   
      });   
}   

function modifierordre(){   
           // envoi ajax   
           // retour ajax   
           // ! ! ! LA FONCTION deplacer() NE MARCHE PLUS pour ce nouveau contenu   
           // ! ! ! donc je la rappelle ici : deplacer();   
}



et pour le retour ajax :

<div class="conteneur">
      // retour ajax
      <div class="travaux"></div>  
      <div class="travaux"></div>  
      <div class="travaux"></div>  
      <div class="travaux"></div>  
      ...  
</div>
0