OnclientClick和OnClick不能同时工作?

时间:2010-01-28 14:12:07

标签: c# asp.net postback onclick onclientclick

我有一个如下按钮,

<asp:Button ID="pagerLeftButton" runat="server" OnClientClick="disable(this)" onclick="pager_Left_Click" Text="<" />

当我使用我的按钮时,onclick不会触发。当我删除OnClientClick时,然后触发onclick。

我需要做的是,在回发期间禁用按钮并在回发结束后启用它。

编辑:其他信息:

我在我的触发功能中添加了断点是c#部分,我正在调试,它们肯定没有触发。这些功能就像

protected void pager_Left_Click(object sender, EventArgs e)
{
//Do smthing.
}
protected void pager_Right_Click(object sender, EventArgs e)
{
//Do smthing.
}

当我点击我的按钮时,它被禁用1-2秒并自动启用,但我不确定为什么启用它。我没有添加任何部分,以便再次启用它。

7 个答案:

答案 0 :(得分:97)

从此article on web.archive.org

  

诀窍是使用按钮控件的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元素并将其文本值更改为progress消息。回发完成后,新呈现的页面将使按钮恢复其初始状态,而无需任何额外的工作。

     

在客户端禁用提交按钮带来的一个缺陷是它将取消浏览器的提交,从而取消回发。将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" />
     

这样可以在回发完成时提供一个很好的按钮禁用效果和处理文本。

答案 1 :(得分:10)

与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;};" />

答案 2 :(得分:6)

Vinay(上图)提供了有效的解决方案。 OnClientClick事件函数后实际导致按钮的OnClick事件不起作用的原因是MS已将其定义在哪里,一旦按钮被禁用(在该函数调用的函数中) OnClientClick事件),按钮&#34;荣誉&#34;这不是通过调用OnClick事件的定义方法来尝试完成按钮的活动。

我努力想要解决这个问题几个小时。一旦我删除了语句以禁用提交按钮(在OnClientClick函数内),就调用了OnClick方法,没有进一步的问题。

Microsoft,如果您正在聆听,,一旦点击该按钮,即使在此活动的某个部分被禁用,也应该完成它已分配的活动。只要在单击时未禁用它,它就应该完成所有已分配的方法。

答案 3 :(得分:6)

这里有两个问题:

禁用客户端上的按钮会阻止回发

要解决此问题,请在 JavaScript onclick事件后禁用按钮。一种简单的方法是按照this answer的建议使用setTimeout

此外,即使ASP.NET验证失败,OnClientClick代码也会运行,因此为Page_IsValid添加检查可能是个好主意。这可确保在验证失败时不会禁用该按钮。

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);
}

禁用客户端上的按钮不会在服务器端禁用它

要解决此问题,请禁用服务器端的按钮。例如,在OnClick事件处理程序中:

OnClick="Button1_Click"

protected void Button1_Click(object sender, EventArgs e)
{
    ((Button)sender).Enabled = false;
}

最后,请记住,防止重复按下按钮不会阻止两个不同的用户同时提交相同的数据。确保在服务器端考虑到这一点。

答案 4 :(得分:2)

如果您没有立即将按钮设置为禁用,但是通过setTimeout延迟该怎么办? 您的“禁用”功能将返回,提交将继续。

答案 5 :(得分:1)

您的JavaScript很好,除非您在此页面上运行其他脚本可能会破坏所有内容。您可以使用Firebug进行检查。

我现在已经测试了一下,看起来ASP.net似乎忽略了禁用的控件。基本上发布了回发,但可能框架忽略了这样的事件,因为它“假设”禁用的按钮不能引发任何回发,因此它忽略了可能附加的处理程序。现在这只是我个人的推理,可以使用Reflector更深入地检查这一点。

作为一种解决方案,您可以在以后尝试禁用,基本上您可以使用JavaTimer或其他功能延迟control.disabled = "disabled"调用。这样,在JavaScript函数禁用控件之前,首先发回服务器的回发。没有测试这个,但它可以工作

答案 6 :(得分:0)

功能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;
}