防止重复提交与验证控件配合使用

为了防止重复提交表单,一般情况下都是在点击按钮后用javascript把提交按钮设为disabled。在asp.net 下通常是使用OnClientClick来实现。

<asp:TextBox ID="txt" runat="server"></asp:TextBox>

<asp:Button ID="btn" runat="server" Text="Button" onclick="btn_Click"  OnClientClick="clientclick()" UseSubmitBehavior="false"/>

 

<script type="text/javascript">

function clientclick()

 

   {
        $("#<%= btn.ClientID%>").attr("disabled",true);
   }
</script>

但是这种情况下如果使用了验证控件，在验证控件启用的时候，按钮同样会被disabled掉，造成最后无法提交表单。

其实验证控件启用的时候就是控制对应span的显示，我们可以用jquery的选择器得到对应的span的数量，然后再把按钮重新启用就可以了。

我的解决办法：

<script type="text/javascript">
   $(document).ready(function(){
   $("#<%= btn.ClientID%>").click(function(){
        var span=$("span[id*='Validator']:visible");
        if(span.length>0) 
        {
            $(this).attr("disabled",false);
        }
   });
   });
function clientclick()
   {
        $("#<%= btn.ClientID%>").attr("disabled",true);
   }
</script>

<asp:TextBox ID="txt" runat="server"></asp:TextBox>
<asp:Button ID="btn" runat="server" Text="Button" onclick="btn_Click"  OnClientClick="clientclick()" UseSubmitBehavior="false"/>
<asp:RequiredFieldValidator ID="Validator" runat="server" 
        ControlToValidate="txt" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>

protected void btn_Click(object sender, EventArgs e)
        {
            //do someing
        }