web-dev-qa-db-ja.com

asp.netでボタンクリックイベントの呼び出しの前後にJavaScript関数を呼び出す方法

次のようにASP.NETで「ButtonClick」関数を作成しました。

<asp:Button ID="btnLogin" runat="server" Text="Login" CssClass="button" CausesValidation="true" onclick="btnLogin_Click"/>

知りたいのですが、asp.netボタンクリック関数を呼び出す前後にJavaScript関数を呼び出すことは可能ですか?

ありがとう。

6
sohaib

はい、可能です。ここに簡単な例を示します:Java呼び出すスクリプト関数。

<script type="text/javascript">
    function clientValidate() {
        alert("execute before");
        return true;
    }

    function executeAfter() {
        alert("execute after");
    }
</script>

ここにボタンのスナップショットがあります

<asp:Button ID="btnLogin" runat="server" Text="Login" CausesValidation="true" OnClientClick="clientValidate()" onclick="btnLogin_Click"/>

プロパティonClientClick = "clientValidate()"に注意してください。サーバーでボタンをクリックする前にトリガースクリプトになります。

サーバー側:

protected void btnLogin_Click(object sender, EventArgs e)
        {
        ScriptManager.RegisterClientScriptBlock(this, GetType(), "none", "<script>executeAfter();</script>", false);
        }

ExecuteAfter();に注意してください。サーバーイベントの後でJavaScriptの実行がトリガーされます。

配置することを忘れないでください<asp:ScriptManager runat="server"></asp:ScriptManager> aspxファイル内。

それが役に立てば幸い

13
Akbar Kautsar

これをページに配置して、scriptmanagerがあることを確認してください。これらのコードは、ポストポストバックを処理します。

var prm, postBackElement;
if (typeof Sys != "undefined") {
    prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);
}

function InitializeRequest(sender, e) {
    postBackElement = e.get_postBackElement();
    if (postBackElement.id == "btnLogin") {
        // before click codes
    }
}
function EndRequest(sender, e) {
    if (postBackElement.id == "btnLogin") {
        // after click codes
    }
}
4
avhinn robles

OnClientClick()を使用して、サーバー側のクリック前にJava scrip関数を呼び出すことができます。

aspx(デザイン)

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function Test() {
            alert('client click');
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button Text="btn" runat="server" ID="btn" 
                        OnClick="btn_Click" OnClientClick="Test()" />
    </div>
    </form>
</body>
</html>

。cs

 protected void btn_Click(object sender, EventArgs e)
 {
    Response.Write("Server Click");
 }
2
Arshad

前:

<script type="text/javascript">
    function executeBefore() {
        alert("execute before");   
    }
</script>

<asp:Button ID="btnLogin" runat="server" Text="Login" CausesValidation="true" OnClientClick="executeBefore()" onclick="btnLogin_Click"/>

後:

<script type="text/javascript">
    function executeAfter() {
        alert("execute after ");    
    }
</script>

このコードをサーバー側イベントに追加します。

Page.ClientScript.RegisterStartupScript(GetType(), "none", "<script>executeAfter();</script>", false);

マスターページがない場合、またはajaxを使用していない場合は、ScriptManagerを追加する必要はありません。

2
live-love

初めて、関数名を渡して、ButtonのOnClientClickイベントでJavaScript関数を呼び出すことができます。

<asp:Button ID="btnLogin" runat="server" Text="Login" CssClass="button" CausesValidation="true" onclick="btnLogin_Click" OnClientClick="return functionNAME();"/>

2回目は、ボタンクリックイベントで次のようにbtnLogin_Click呼び出しjs

ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "script", "<script type='text/javascript'>functionNA();</script>", false);
1
joker

前に呼び出すには、次の例のように、onload関数の使用を検討できます。

<body onload="myFunction()">

後で呼び出すには、ボタンをリンクしてJS onClickを実行しますか?

あなたの意図がよくわかりません。

0
ChoiceMC