OnclientClick和OnClick不在同一时间工作?
我有一个像下面这样的button,
<asp:Button ID="pagerLeftButton" runat="server" OnClientClick="disable(this)" onclick="pager_Left_Click" Text="<" />
当我使用我的button时,onclick不会触发。 当我删除OnClientClick,然后onclick发射。
我需要做的是,在回发期间禁用button,并在回发结束后启用它。
编辑:其他信息:
我添加了中断点,我的发射function是C#部分,我正在debugging,他们不是肯定的射击。 这些function就像
protected void pager_Left_Click(object sender, EventArgs e) { //Do smthing. } protected void pager_Right_Click(object sender, EventArgs e) { //Do smthing. }
当我点击我的button,它被禁用1-2秒,并自动启用,但我不知道为什么它启用。 我没有添加任何部分让它再次启用。
从web.archive.org上的这篇文章 :
诀窍是使用button控件的OnClientClick和UseSubmitBehavior属性。 还有其他方法,包括在服务器端添加属性的代码,但我认为这样做的简单性更吸引人:
<asp:Button runat="server" ID="BtnSubmit" OnClientClick="this.disabled = true; this.value = 'Submitting...';" UseSubmitBehavior="false" OnClick="BtnSubmit_Click" Text="Submit Me!" />
OnClientClick允许您添加客户端的OnClick脚本。 在这种情况下,JavaScript将禁用button元素并将其文本值更改为进度消息。 回发完成后,新呈现的页面将恢复button的初始状态,无需任何额外的工作。
在客户端禁用提交button的一个缺点是,它将取消浏览器的提交,因此回发。 将UseSubmitBehavior属性设置为false会告诉.NET注入必要的客户端脚本来触发回发,而不是依靠浏览器的表单提交行为。 在这种情况下,它注入的代码将是:
__doPostBack('BtnSubmit','')
这被添加到我们的OnClientClick代码的末尾,给我们这个呈现的HTML:
<input type="button" name="BtnSubmit" onclick="this.disabled = true; this.value ='Submitting...';__doPostBack('BtnSubmit','')" value="Submit Me!" id="BtnSubmit" />
这给了一个很好的button禁用效果和处理文本,而回发完成。
与OnClick一起使用时,OnClientClick似乎非常挑剔。
我尝试了以下用例失败:
OnClientClick="return ValidateSearch();" OnClientClick="if(ValidateSearch()) return true;" OnClientClick="ValidateSearch();"
但他们没有工作。 以下工作:
<asp:Button ID="keywordSearch" runat="server" Text="Search" TabIndex="1" OnClick="keywordSearch_Click" OnClientClick="if (!ValidateSearch()) { return false;};" />
Vinay(以上)提供了有效的解决方法。 实际上导致button的OnClick事件不能在OnClientClick事件函数之后工作的是,MS已经定义了它的位置,一旦button被禁用(在由OnClientClick事件调用的函数中),button“通过不尝试完成该button的活动通过调用OnClick事件的定义的方法。
试图弄清楚这一点我挣扎了好几个小时。 一旦我删除语句来禁用提交button(这是在OnClientClick函数内),OnClick方法被调用,没有进一步的问题。
微软,如果你在听,一旦button被点击,它应该完成它的分配的活动,即使它被禁用部分途径通过这个活动。 只要点击时没有被禁用,它应该完成所有分配的方法。
这里有两个问题:
禁用客户端上的button可防止回发
为了解决这个问题,在JavaScript onclick
事件之后禁用button。 一个简单的方法是按照这个答案的build议使用setTimeout
。
此外,即使ASP.NETvalidation失败, OnClientClick
代码也会运行,因此添加对Page_IsValid
的检查可能是一个好主意。 这确保如果validation失败,button不会被禁用。
OnClientClick="(function(button) { setTimeout(function () { if (Page_IsValid) button.disabled = true; }, 0); })(this);"
将所有这些JavaScript代码放在它自己的函数中是更加简单的,因为问题显示:
OnClientClick="disable(this);" function disable(button) { setTimeout(function () { if (Page_IsValid) button.disabled = true; }, 0); }
禁用客户端上的button不会在服务器端禁用它
要解决这个问题,请禁用服务器端的button。 例如,在OnClick
事件处理程序中:
OnClick="Button1_Click" protected void Button1_Click(object sender, EventArgs e) { ((Button)sender).Enabled = false; }
最后,请记住,防止重复button不会阻止两个不同的用户同时提交相同的数据。 确保在服务器端考虑到这一点。
如果你不立即将button设置为禁用,但通过setTimeout延迟? 您的“禁用”function将返回并提交将继续。
你的JavaScript是好的,除非你在这个页面上运行的其他脚本可能会破坏一切。 您可以使用Firebug进行检查。
我现在已经testing了一下,看来ASP.net忽略了禁用的控件。 基本上回发是发布的,但可能框架忽略这样的事件,因为它“假设”一个禁用的button不能提出任何回发,所以它忽略可能附加的处理程序。 现在,这只是我个人的推理,可以使用Reflector更深入地检查。
作为一个解决scheme,您可以尝试在稍后的时间进行禁用,基本上可以使用JavaTimer或其他function延迟control.disabled = "disabled"
调用。 通过这种方式,在JavaScript函数禁用控件之前,先发送回服务器。 没有testing这个,但它可以工作
函数UpdateClick(btn){
for (i = 0; i < Page_Validators.length; i++) { ValidatorValidate(Page_Validators[i]); if (Page_Validators[i].isvalid == false) return false; } btn.disabled = 'false'; btn.value = 'Please Wait...'; return true; }