当 ASP.NET 客户端验证失败时，如何隐藏 throbber？答案

【问题标题】：How do I hide a throbber when ASP.NET client side validation fails?当 ASP.NET 客户端验证失败时，如何隐藏 throbber？
【发布时间】：2010-01-02 20:38:30
【问题描述】：

我正在使用 ASP.NET 登录控件，并在单击提交按钮时显示jQuery throbber。这很好用，但是如果客户端验证失败并且按钮不可见，则 throbber 是可见的，因此用户无法重新提交表单。如果客户端验证失败，如何隐藏 throbber？

【问题讨论】：

标签： asp.net jquery throbber

【解决方案1】：

在不了解细节的情况下...为什么不只在客户端验证通过时启动 throbber？作为用户，我会惊讶地看到一个 UI 元素非常短暂地闪现，只是再次被删除并被错误消息替换。

【讨论】：

这可能是一个更好的方法，但我仍然必须解决响应客户端验证结果的相同问题。一旦我达到这一点，我会尝试两种方式。但是，我的主要目标是防止用户在网站在 10 纳秒内没有响应的情况下多次单击该死的按钮。 :-)
@Jamie：所以一旦用户点击就禁用按钮。如果验证失败则重新启用它，或者如果验证成功则显示 throbber。是的，您必须对客户端验证的结果做出响应——我原以为这是理所当然的。
@Jon 这不是给定的，而是问题所在。在使用 ASP.NET 验证控件时，我不知道如何确定客户端验证的结果（在客户端）。在这种情况下，我可以轻松编写自己的验证，但是一旦我在登录表单上使用它，我想在具有许多控件的表单上实现它。
@Jamie：你的问题是关于 throbber，IMO 是本末倒置。暂时我会完全忽略事情的悸动方面。直奔根本原因：阅读客户端验证以及如何响应其结果。我自己对此了解不多，但我希望任何有关 ASP.NET 验证的教程或书籍都能进入其中。
@Jon：感谢您的回复，但如果在教程中很容易找到答案，我不会在这里问这个问题。

【解决方案2】：

这有点棘手，但我得到了这个工作。首先，必须对 Login 控件进行模板化，这是我所期望的，但即便如此，按钮的 ClientID 也是不可访问的，所以我不得不向它添加一个类选择器。我首先尝试使用轻微/未记录的 Page_ClientValidate() 事件添加 throbber 并在验证成功时将其打开，但这不起作用，因为 throbber 默认订阅按钮的单击事件并在验证发生之前打开。

起作用的是坚持mini API，如果 Page_IsValid 为真，则将 throbber 添加到按钮。按钮的 CausesValidation 属性必须为 true（默认值）。

javascript：

    $(document).ready(function() {
        $('.login').click(function() {
            if (Page_IsValid) {
                $('.login').throbber({ image: "Images/throbber.gif" });
            }
        });
    });

按钮标记； Login 控件模板中唯一添加的是 CssClass 属性：

<asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="uxLogin" CssClass="login" />

【讨论】：