Saturday, December 08, 2007 - 文章

UpdatePanel PostBack時執行Javascript範例

之前寫過一篇介紹在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>

搜尋

Go

<December 2007>
SunMonTueWedThuFriSat
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345
 
RSS
【工商服務】
最新回應

Tags 分類檢視
關於作者

一個醉心技術又酷愛分享的Coding魔人,十年的IT職場生涯,寫過系統、管過專案, 也帶過團隊,最後還是無怨無悔地選擇了技術鑽研這條路,近年來則以做一個"有為的中年人"自許。

文章典藏
其他功能

這個部落格


BlogLook Score and Rank

Syndication