在C＃UpdatePanel更新後更新JavaScript

Question

我有一個動態創建的JavaScript塊，它在頁面加載時執行。 JS在UpdatePanel中。

UpdatePanel更新時，我需要更新我的動態創建的JavaScript。這一切都正常工作，因爲當我查看生成的頁面源，我可以看到更新的JS。

我的問題是，頁面更新後，我需要手動重新執行JavaScript函數（因爲這通常在頁面加載時自動完成）。

我已經嘗試了多種方法：

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded); 

function pageLoaded(sender, args) { 
    var updatedPanels = args.get_panelsUpdated(); 

    // check if Main Panel was updated 
    for (idx = 0; idx < updatedPanels.length; idx++) { 
     if (updatedPanels[idx].id == "PageContent_TabContent_UpdatePanel1") { 
      drawVisualization(); 
      break; 
     } 
    } 
} 

或者：

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(handleEndRequest); 

function handleEndRequest(sender, args) { 
    drawVisualization(); 
} 

但上述兩種方法只是執行舊版本的JavaScript，而根據生成的源代碼已經改變。

有什麼我錯過了，或者我可以嘗試另一種方法嗎？

UPDATE：

使用評論@Mehdi Maujood，我已經把工作解決方案：

function handleEndRequest(sender, args) 
{ 
    var updatedPanels = args.get_panelsUpdated(); 
    for (idx = 0; idx < updatedPanels.length; idx++) { 
     if (updatedPanels[idx].id == "PageContent_TabContent_UpdatePanel1") { 

      var scripts = updatedPanels[idx].getElementsByTagName('script'); 
      for(var i=0;i<scripts.length;i++) { 
       eval(scripts[i].innerHTML); 
      } 

      drawVisualization(); 
      break; 
     } 
    } 
} 

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(handleEndRequest); 

這結合了How can I recall a javascript function after updatepanel update解答以及@ shatl對Rebinding events in jQuery after Ajax update (updatepanel)評論。

Answer 1

據我所知，你遇到的問題是，通過更新面板呈現的JavaScript沒有得到執行。我搜索了一下，這似乎是常見的問題。瀏覽器似乎不會執行包含在更新面板中的腳本。

問題是，儘管更新後的腳本被髮送到瀏覽器，但它永遠不會執行。 drawVisualization從不重新定義。你可以嘗試這樣的事情從你的C＃代碼：

string script = "function drawVisualization() { alert('Drawing code here') }"; 

ScriptManager.RegisterClientScriptBlock(this.Page, typeof(SomeClass), Guid.NewGuid().ToString(), script, true); 

到的RegisterClientScriptBlock的通話可能需要固定的一些參數;我只是從某處複製它。

編輯：我發現了一個更好的方法來從另一個問題做到這一點。請參閱評論。下面是一段代碼執行的更新面板呈現腳本（你可以忽略前面的代碼）：

<script type="text/javascript"> 
    function handleEndRequest(sender, args) 
    { 
     var panel = document.getElementById(sender._postBackSettings.panelID); 
     var scripts = panel.getElementsByTagName('script'); 
     for(var i=0;i<scripts.length;i++) { 
      eval(scripts[i].innerHTML); 
     } 
    } 

    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(handleEndRequest); 
</script>