2009-07-30 5 views
5

J'ai jquery ensemble d'événements jquery pour mouseelearve mouseenter, ainsi que jquery draggable. Les divs sont placés dans un panneau de mise à jour et lorsqu'un bouton est cliqué, les informations sont envoyées à la base de données et le panneau de mise à jour est mis à jour. Cependant, lorsque le panneau est mis à jour, les événements jquery ne fonctionnent plus. Une idée de pourquoi ce serait le cas?Le panneau de mise à jour ASP.NET arrête jquery de fonctionner

Répondre

7

Vous pouvez ajouter un déclencheur asynchrone à votre page pour appeler un JavaScript/Fonction jQuery après tout appel asynchrone.

Placez ce code dans votre Page_Load() de votre code ASPX derrière:

//This script handles ajax postbacks, by registering the js to run at the end of *AJAX* requests 
Page.ClientScript.RegisterStartupScript(typeof(Page), "ajaxTrigger", "Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);", true); 
Page.ClientScript.RegisterClientScriptBlock(typeof(Page), "EndRequest", "function EndRequestHandler(sender, args){AsyncDone();}", true); 

Cet extrait de code appellera spécifiquement la fonction JavaScript/JQuery AsyncDone();

+0

J'ai essayé ceci, mais ma fonction "AsyncDone()" n'a pas été appelée. – ErnieStings

+0

Avez-vous essayé de mettre une alerte pour voir si elle est appelée? Vous devrez rebrancher vos événements jquery après chaque chargement de page asynchrone dans la fonction AsyncDone(). –

1

Utilisez live.

$("div").live("mouseenter", function(){ 
     // do something 
    }); 
+0

des jquery docs pour « live »: pas pris en charge: flou, mise au point, mouseenter, mouseleave, changement , submit –

+0

Pour les personnes qui ont récemment trouvé cette question, ce n'est plus le cas, jQuery 1.4 et les versions plus récentes prennent en charge tous les événements qui surviennent. https://api.jquery.com/live/ – nyuszika7h

3

essayer d'utiliser

function pageLoad(sender, args) 
{ 
    // JQuery code goes here 
} 

au lieu de

$(document).ready(function() { 
     // JQuery code goes here 
    }); 

Cela fonctionne quand un bouton qui se trouve dans un panneau de mise à jour est cliqué; il va au serveur et rajoutera le jquery quand il reviendra. Cependant, cela ne fonctionne pas avec les postbacks asynchrones causés par un contrôle tel que eo: AJAXUploader mais en combinant cela avec la version de Bryans, vous pouvez également gérer les postbacks asynchrones

3

Jetez un oeil à ce blog post de Encosia qui vous donne plusieurs façons de relier après les mises à jour asynchrones. J'ai trouvé cela résolu mon problème qui était similaire.

0

Bryan a la réponse. Je joins généralement que certains gestionnaires d'événements, pour le dépouillement et tel, que le feu après postbacks avec ceci:

/** 
    * .NET Event Handlers 
    * When new code is added on to the client by way of 
    * .NET PostBacks, CSS is typically ignored. This method 
    * can be used to add CSS to new elements as they are added 
    * asynchronously. It calls a script at the end of every 
    * partial post back request. 
    * 
    * @example - Core.NETEventHandlers.AsyncPostBack.Init(); 
    */  
    var NETEventHandlers: { 
     /** 
     * Async Post Back Handler 
     * calls a script at the end of every partial post back request 
     */   
     AsyncPostBack: { 
      EndRequest: { 
       Add: function() { 
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(NETEventHandlers.AsyncPostBack.EndRequest.Handler); 
       } // EO Add 
       , Handler: function(sender, args) { 
        // Handlers here. 
        alert('Hello World'); 
       } // EO Handler 
      } // EO endRequest 
      , Init: function() { 
       Sys.Application.add_init(NETEventHandlers.AsyncPostBack.EndRequest.Add); 
      } 
     } // EO AsyncPostBack 
    } // EO dotNETEventHandlers 
Questions connexes