6

之前寫過一篇介紹在UpdatePanel動態更新時觸發Javascript的方法，不過有網友反應不清楚實作的細節，索性就寫一個極簡單的程式，實際示範一下。

<%@ Page Language="C#" AutoEventWireup="true" %>
<html>
<head><title>UpdatePanel Call Javascript</title></head>
<body>
    <form id="form1" runat="server">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
                <asp:Button ID="Button1" runat="server" Text="Button" 
                onclick="Button1_Click" />
                <asp:HiddenField ID="hdnScript" runat="server" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <script type="text/javascript">
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(blah);
        function blah() {
            eval($get("hdnScript").value);
        }
        </script>
    </form>
<script type="text/C#" runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
    hdnScript.Value = "alert('I did it!');";
}
</script>
</body>
</html>

運作的原理是利用add_endRequest()在每次UpdatePanel Postback時觸發blah()函數，blah()會用eval()執行Hidden欄位的字串值，所以在Server-Side將要執行的Javascript Code以字串方式傳回，按下按鈕後就會被執行。That's all, folks.

PS: 順便宣導一下資安觀念，傳回的Javascript Code不宜開放給User自行輸入或更動，不然會造成XSS攻擊的漏洞。
PS2: 用VS 2008寫這段Code時，輸入Sys.WebForms.PageRequestManager.getInstance()後還會提示add_Request，不亦快哉!!

Update 2007-12-08

Javascript牛人Ammon再露了一手，提供更簡便的做法ScriptManager.RegisterStartupScript()，在此謝過: 

<%@ Page Language="C#" AutoEventWireup="true" %>
<html>
<head><title>UpdatePanel Call Javascript</title></head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Button ID="Button1" runat="server" Text="Button" 
                onclick="Button1_Click" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
<script type="text/C#" runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
    ScriptManager.RegisterStartupScript(Button1, typeof(Button),
        "alert", "alert('Amazing');", true);
}
</script>
</body>
</html>

Comments

# by 馬克

請問一下，您是否有試過，如第二個範例一般，但是ScriptManager.RegisterStartupScript改成一個confirm,confirm成立的話，再去觸發另一個button的事件呢？

# by Jeffrey

to 馬克，聽起來是可行的，你在實作上有遇到困難嗎?

# by 魔方网

to Jeffrey 做起来比较困難，不好实现。

# by gym

to 馬克，如果实现麻烦在这里告诉下

# by 小路

最近有遇到這個需求，只是postback 的對象為 GridView 裡面的 label XD，這又該如何實現呢?請教了。

# by 爽牛

有很大的幫助，感謝

Post a comment