ASP.NET中在点击按钮后将该按钮设为不可用的若干情况

项目中经常出现用户重复提交的情况，为了防止这种情况，最常用的方法就是在用户点击按钮后将该按钮设为不可用，笔者在实际开发当中遇到了多种不同的情况，在此做个小结，以供参考。

第一种情况是非submit类型的按钮

这种情况比较简单，只要在客户端添加事件，将按钮设为不可用就可以了。看下面的代码：

ASP.NET-Code:

<form id="form1" runat="server">
        <asp:Label ID="lbl" runat="server"></asp:Label>
        <asp:Button ID="btn" runat="server" Text="Test"
            OnClick="btn_Click" OnClientClick="this.disabled=true"
            UseSubmitBehavior="false" />
</form>

C#-Code:

protected void btn_Click(object sender, EventArgs e)
{
    System.Threading.Thread.Sleep(1000);
    lbl.Text = DateTime.Now.ToString();
}

第二种情况是submit类型的按钮

此时第一种方法就不行了，按钮被设为DISABLED之后就无法完成提交，我们可以适当修改代码：

ASP.NET-Code:

<form id="form1" runat="server">
    <asp:Label ID="lbl" runat="server"></asp:Label>
    <asp:Button ID="btn" runat="server" Text="Test"
        OnClick="btn_Click"/>
</form>

C#-Code:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        btn.OnClientClick = "this.disabled=true;" +
            GetPostBackEventReference(btn);
    }
}

与第一种方法不同的是我们在Page_Load中给按钮添加客户端事件，并附加了 GetPostBackEventReference。但这样做还有个缺陷，在第一提交回发完成以后，再点击按钮就会失败，因此我们需要去掉if (!Page.IsPostBack)这句，也就是每次回发都要重复绑定客户端事件。

第三种情况跟第一种类似，只是多了个UpdatePanel

 

ASP.NET-Code:

<asp:UpdatePanel ID="up1" runat="server" >
    <ContentTemplate>
        <asp:Label ID="lbl" runat="server"></asp:Label>
        <asp:Button ID="btn" runat="server" Text="Test"
            OnClick="btn_Click"
            OnClientClick="this.disabled=true;"
            UseSubmitBehavior="false" />
    </ContentTemplate>
</asp:UpdatePanel>

第四种情况也是在UpdatePanel里面，不过和第二种情况一样，也是Submit类型的按钮

和第二种情况不同的是，我们只需要在第一次加载的时候绑定客户端事件就可以了，即在 if (!Page.IsPostBack){}中绑定事件。

第五种和第四种不同的是，按钮在UpdatePanel外面，通过触发器来刷新指定的UpdatePanel

如果按第四种的方法，可以在点击按钮后设为不可用，但回发完成以后该按钮不会恢复可用状态：

ASP.NET-Code:

<asp:UpdatePanel ID="up1" runat="server">
    <ContentTemplate>
        <asp:Label ID="lbl" runat="server"></asp:Label>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="btn"
            EventName="Click" />
    </Triggers>
</asp:UpdatePanel>
<asp:Button ID="btn" runat="server" Text="Test"
    OnClick="btn_Click" />

 

C#-Code:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        btn.OnClientClick = "this.disabled=true;" +
            GetPostBackEventReference(btn);
    }
}
protected void btn_Click(object sender, EventArgs e)
{
    System.Threading.Thread.Sleep(1000);
    lbl.Text = DateTime.Now.ToString();
}

为了解决这个问题，最简单的方法就是将该按钮放在另一个UpdatePanel里面，这样每次都可以恢复原状态了。另外还可以根据Atlas的页面周期，在提交完成以后显式将该按钮设为可用。

 

-----------------------------------------------------------------------

千淘返利网 http://www.1000tao.com/

-----------------------------------------------------------------------