Il pannello di aggiornamento ASP.NET interrompe il funzionamento di jquery

Question

Ho associato eventi jquery impostati per mouseenter mouseleave, nonché jquery trascinabili. I div vengono inseriti in un pannello di aggiornamento e quando si fa clic su un pulsante, le informazioni vengono inviate al database e il pannello di aggiornamento viene aggiornato. Tuttavia, quando il pannello viene aggiornato, gli eventi jquery non funzionano più. Qualche idea sul perché questo sarebbe il caso?

Answer 1

Puoi aggiungere un trigger asincrono alla tua pagina per chiamare una funzione JavaScript / jQuery dopo qualsiasi chiamata asincrona.

Inserisci questo codice nel tuo Page_Load () del tuo codice aspx dietro:

//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);

Questo frammento di codice chiamerà specificamente la funzione JavaScript / jQuery AsyncDone ();

Answer 2

prova a usare

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

anziché

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

Funzionerà quando si fa clic su un pulsante all'interno di un pannello di aggiornamento; va al server e aggiungerà nuovamente jquery al suo ritorno. Tuttavia, questo non funziona con i postback asincroni causati da un controllo come eo: AJAXUploader ma combinando questo con la versione di Bryans è possibile gestire anche i postback asincroni

Answer 3

Dai un'occhiata a questo post di blog di Encosia che ti offre un paio di modi per effettuare il rebinding dopo gli aggiornamenti asincroni. Ho trovato questo risolto il mio problema che era simile.

Answer 4

Usa live .

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

Answer 5

Bryan ha la risposta. In genere aggiungo che con alcuni gestori di eventi, per lo skinning e simili, questo spara dopo PostBack con questo:

    /**
    *   .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