2009-07-30 13 views
5

jquery draggableと同様に、mouseenter mouseleaveにjqueryイベントをバインドしました。 divは更新パネルに配置され、ボタンをクリックすると情報がデータベースに送られ、更新パネルが更新されます。ただし、パネルが更新されると、jqueryイベントは機能しなくなります。なぜこれが当てはまるのかについての考えはありますか?ASP.NET Update Panelはjqueryの動作を停止します

答えて

7

ページに非同期トリガーを追加して、JavaScript /任意の非同期呼び出し後のjQuery関数

の後ろにあなたのaspxコードの場所あなたのPage_Loadでこのコード():

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

特異的に)(のJavaScript/jQueryの関数AsyncDoneを呼び出します。このコードスニペット。

+0

これを試しましたが、私の "AsyncDone()"関数が呼び出されませんでした。 – ErnieStings

+0

アラートが表示されているかどうかを確認するようにしましたか? AsyncDone()関数内で非同期のページが読み込まれるたびに、jqueryイベントを再接続する必要があります。 –

1

liveを使用してください。

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

「ライブ」のためのjQueryのドキュメントから: は現在サポートされていません:ぼかし、フォーカス、MouseEnterイベント、mouseleave、変更を私は通常、これにポストバック後、スキニングなどのために、いくつかのイベントハンドラでその火をことを追加します、submit –

+0

この質問を新たに発見した人のために、これはもはやケースではなく、jQuery 1.4以降のバージョンではすべてのイベントをサポートしています。 https://api.jquery.com/live/ – nyuszika7h

3

は、更新パネル内にあるボタンがクリックされたとき、これは動作します

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

代わりの

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

を使用してみてください。それはサーバーに行き、jqueryが戻ってきたときにそれを再び追加します。しかし、これは、eo:AJAXUploaderなどのコントロールによって引き起こされる非同期ポストバックでは機能しませんが、これをBryansバージョンと組み合わせることで非同期ポストバックも処理できます。

3

Encosiaのblog postをご覧ください。これは、非同期更新後のリビルド方法をいくつか示しています。私はこれが似ている私の問題を解決したことがわかりました。

0

ブライアンが答えを得ました。

/** 
    * .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 
関連する問題