Question

当我点击ASP.NET页面中的按钮时，我试图发生两件事：

更改ASP中的文字：标签。
禁用按钮。

我对此做了很多研究，但我也遇到了困难。

对于＃1，我认为这应该有效，但事实并非如此：

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">


    Protected Sub BtnSubmit_Click(sender As Object, e As System.EventArgs)
        Label1.Text = "Working..."

        System.Threading.Thread.Sleep(5000)

        Label1.Text = "Done."

    End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <ajaxToolkit:ToolkitScriptManager runat="server" />
    <div>
        <asp:ListBox runat="server" Height="100px" />
        <br />
        <asp:UpdatePanel runat="server">
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="BtnSubmit" EventName="Click" />
            </Triggers>
            <ContentTemplate>
                <asp:Label ID="Label1" runat="server" Text="Press the button" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <br />
        <asp:Button runat="server" ID="BtnSubmit" OnClick="BtnSubmit_Click" Text="Submit Me!" />
    </div>
    </form>
</body>
</html>

永远不会显示“正在工作...”消息。

至于＃2，我把它添加到按钮（我忘了找到的地方）：

OnClientClick="this.disabled = true; this.value = 'Working...';"
            UseSubmitBehavior="false"

具有禁用按钮和更改其文本（值）的预期效果，但无法使用“文本”和“已启用”属性将其更改回来。

Answer 1

我刚刚在msdn（http://msdn.microsoft.com/en-us/library/bb386518.aspx)上找到了解决方案。添加了一些代码并删除了一些不必要的部分。

<%@ Page Language="C#"  %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
protected void btnDoWork_Click(object sender, EventArgs e)
{
    /// do something long lasting
    System.Threading.Thread.Sleep(3000);
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <script language="javascript" type="text/javascript">
    <!-- 
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);
    var postBackElement;
    function InitializeRequest(sender, args) {
        if (prm.get_isInAsyncPostBack()) {
            args.set_cancel(true);
        }
        postBackElement = args.get_postBackElement();
        if (postBackElement.id == 'btnDoWork') {
            $get('btnDoWork').value = 'Working ...';
            $get('btnDoWork').disabled = true;
        }
    }
    function EndRequest(sender, args) {
        if (postBackElement.id == 'btnDoWork') {
            $get('btnDoWork').value = 'Done!';
            $get('btnDoWork').disabled = false;
        }
    }
    // -->
    </script>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:Label ID="Label1" runat="server" Text="Hello World!"></asp:Label><br />
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnDoWork" />
        </Triggers>
    </asp:UpdatePanel>
    <asp:Button ID="btnDoWork" runat="server" Text="Start!" OnClick="btnDoWork_Click" />
</div>
</form>
</body>
</html>

您基本上做的是，在初始化_ 和 End_Request 中注册一些eventHandler - 在您禁用并启用按钮的那些！

HTH

Answer 2

永远不会显示工作消息，因为您正在服务器上执行脚本，该方法在方法退出之前不响应客户端。

ASP.NET AJAX有一个内置控件，用于在UpdatePanel等待服务器时显示这样的消息。

查看UpdateProgress控件：

<asp:UpdateProgress runat="server" id="progress" ><ProgressTemplate>Working...</ProgressTemplate></asp:UpdateProgress>

您可以通过在服务器端方法中将Enabled属性设置为false来禁用该按钮。

BtnSubmit.Enabled = false

Answer 3

即使您使用UpdatePanel，ASP也不会在工作时将结果刷新到浏览器。它会在冲洗前完成工作（包括睡眠）。

您可以使用UpdateProgress显示“Working ..”文本。

<asp:UpdateProgress>

这将在UpdatePanel工作时显示其内容。 UpdatePanel完成后，内容将消失。

您需要的是ClickEvent：

Label1.Text = "Done."
btnSubmit.Enabled = false

这将显示完成文本并禁用该按钮。并告诉UpdateProgress消失。

Answer 4

@ 1：当您停止线程时，您将永远不会看到消息“正在工作”....当您的流程“结束”时，每条消息都会显示。

@ 2：您编写了clientSide以禁用该按钮，没有代码可以重新启用您的按钮

HTH

Answer 5

首先，“工作”永远不会出现，因为回复时标签的最终价值是“完成”。想想这里发生了什么 - 你点击按钮导致回发到服务器。它处理回发，包括运行按钮点击代码，然后将其结果发送回浏览器。你的“工作”文本永远不会通过网络重新启动。

我不清楚你要用客户端代码完成什么，但要做你所描述的，你在服务器端做的是almsot：

Protected Sub BtnSubmit_Click(sender As Object, e As System.EventArgs)
    Label1.Text = "Done."
    btnSubmit.Enabled = false
End Sub

此外，您的更新面板模板中的按钮标记，因此它参与了ajax-postback。

使用UpdatePanel单击按钮后更新ASP.NET标签

5 个答案: