提交后禁用按钮

2024-06-20

当用户提交付款表单并且发布表单的代码导致 Firefox 中出现重复发布时,我试图禁用按钮。 去掉代码就不会出现这个问题,在firefox以外的任何浏览器中也不会出现这个问题。

知道如何防止双重帖子吗?

System.Text.StringBuilder sb = new StringBuilder();
sb.Append("if (typeof(Page_ClientValidate) == 'function') { ");
sb.Append("if (Page_ClientValidate() == false) { return false; }} ");
sb.Append("this.value = 'Please wait...';");
sb.Append("this.disabled = true;");
sb.Append(Page.GetPostBackEventReference(btnSubmit ));
sb.Append(";");
btnSubmit.Attributes.Add("onclick", sb.ToString());

这是导致问题的 sb.Append(Page.GetPostBackEventReference(btnSubmit )) 行

Thanks

编辑:这是按钮的 c#:

<asp:Button ID="cmdSubmit" runat="server" Text="Submit" />

这是 HTML

此代码发布两次(并禁用提交按钮并验证输入):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="if (typeof(Page_ClientValidate) == 'function') { if (Page_ClientValidate() == false) { return false; }} this.value = 'Please wait...';this.disabled = true;document.getElementById('ctl00_MainContent_cmdBack').disabled = true;__doPostBack('ctl00$MainContent$cmdSubmit','');" id="ctl00_MainContent_cmdSubmit" />


此代码发布两次(但不会禁用提交按钮):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="__doPostBack('ctl00$MainContent$cmdSubmit','');" id="ctl00_MainContent_cmdSubmit" />


此代码发布一次(但不验证用户输入,也不禁用提交按钮):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" id="ctl00_MainContent_cmdSubmit" />


此代码发布一次(但不会禁用提交按钮):

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$cmdSubmit&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="ctl00_MainContent_cmdSubmit" />

此代码根本不发布:

<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="this.disabled = true;WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$cmdSubmit&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="ctl00_MainContent_cmdSubmit" />   

显然,提交按钮的禁用造成了问题。您对我们如何禁用提交以避免多次点击有什么想法吗?


想必,btnSubmit已经连接了服务器端事件。如果是这样,请致电Page.GetPostBackEventReference应该没有必要。您只需删除该行即可获得所需的行为。

更新:您提到在 C# 代码中附加事件处理程序,但没有提到在哪里执行此操作。我猜它在Page_Load处理程序。如果是这种情况,它将无法正常工作,因为此时连接按钮单击事件处理程序为时已晚。让我们试试这个。

首先,将 JS 放入它自己的函数中而不是在 C# 代码隐藏中构建它会更干净。我建议您将其放入脚本块中(或者更好的是,它是自己的 .js 文件。)

function disableOnSubmit(target)
{
    if (typeof(Page_ClientValidate) == 'function') {
        if (Page_ClientValidate() == false) { return false; }
    }
    target.value = 'Please wait...';
    target.disabled = true;
    return true;
}

对于您的 ASPX 按钮,请尝试以下操作:

<asp:Button ID="cmdSubmit" runat="server" Text="Submit" onclick="btnSumbit_Click" OnClientClick="return disableOnSubmit(this);" />
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

提交后禁用按钮 的相关文章

随机推荐