0

ASPサーバーボタンのonClickイベントからJavaScript関数を呼び出そうとしています。更新パネルにこのボタンとラベルがあります。

aspx で:

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
       <ContentTemplate>
         <asp:Button ID="Button1" runat="server" 
            style="z-index: 1; left: 49px; top: 119px; position: absolute; height: 26px;" Text="Button" 
            onclick="Button1_Click"/>
         <asp:Label ID="Label1" runat="server" Text="l1" 
            style="position:absolute; top: 123px; left: 127px;"></asp:Label>
       </ContentTemplate>
    </asp:UpdatePanel>

コードビハインド:

protected void Button1_Click(object sender, EventArgs e)
{
   ScriptManager.RegisterClientScriptBlock(this, typeof(Button), "me", "me()", true);
}

aspx の Javascript:

<script type="text/javascript">
function me()
{
   document.getElementById('<%= Label1.ClientID %>').value="clicked";
}
</script>

私がやろうとしているのは、ボタンをクリックしてラベルの値を「クリック済み」に変更することだけです。これは発生しておらず、firebugでもエラーは発生しません。me( ) のどこが間違っていますか?

PS: コード ビハインドから JavaScript 関数の呼び出しを学習するためにこれを行っています。したがって、コードの最適化も大歓迎です。（実際には、後でJS関数に実装するコードがたくさんあるので、適切な提案をお願いします）

4

1 に答える 1

5

私が覚えている限りでは、Label コントロールはテキスト入力フィールドではなく、<div>または<span>(正確には思い出せません) としてレンダリングされます。innerHTMLしたがって、次のプロパティではなく、そのプロパティを設定する必要がありますvalue。

document.getElementById('<%= Label1.ClientID %>').innerHTML = 'clicked';

または、クライアント側のコールバックを登録する代わりに、サーバー側で単純に実行します。

protected void Button1_Click(object sender, EventArgs e)
{
   Label1.Text = "clicked";
}

アップデート：

コメント セクションで要求されているように、サーバーからクライアント側のコールバックにパラメーターを渡す方法は次のとおりです。

protected void Button1_Click(object sender, EventArgs e)
{
    string param1 = ...
    double param2 = ...
    int param3 = ...
    var serializer = new JavaScriptSerializer();

    ScriptManager.RegisterClientScriptBlock(
        this, 
        typeof(Button), 
        "me", 
        string.Format("me({0})", serializer.Serialize(new { param1 = param1, param2 = param2, param3 = param3 })), 
        true
    );
}

そしてあなたのコールバック：

function me(values) {
    // you could use values.param1, values.param2, values.param3, ... here
}
于 2012-09-12T09:10:11.323 に答える