Jquery 验证和更新面板一起使用

Question

我正在尝试使用 jqueryvalidation 插件，但我的表单位于更新面板中。因此，即使在提交表单时应用验证后，它也会验证并显示所需的消息几乎 2 秒，然后提交表单。
解决这个问题的方法是什么？

我也尝试过这个。

<asp:UpdatePanel ID="AddUserPanel" runat="server"
             ChildrenAsTriggers="false"
             UpdateMode="Conditional">

但这似乎也没有帮助。

Answer 1

如果您使用脚本管理器，则需要下面的 l33t 代码：

  $(function () {
 //Code that runs before update panel is fired.

        //Listen for update panel
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
        //Re-initialize jquery after an auto post back.
        function EndRequestHandler(sender, args) {
            //Do work after update panel fires.
        } 
    });

所以基本上您有重复的代码，即 EndRequestHandler() 外部和内部的代码。

Answer 2

您需要返回 false 并停止 onsubmit 上的事件冒泡，如下所示：

$("form").submit(function (e) {
  e.preventDefault();
  return(false);
});

但是我对 ASP 一无所知，所以我不知道这在这种特殊情况下是否有帮助。

也许您需要使用 .live 或在加载此面板中的内容后重新附加处理程序，以便将 onsubmit 事件绑定到它？

Answer 3

Asp.net WebForms 使用 __doPostback() 函数来提交表单。

这就是我要做的：

1. 检查表单提交执行以查看事情是否按预期工作，因此首先进行验证（我很确定它会这样做，因为您确实收到了这些消息）并检查每个单独部分的代码.

2. 如果验证不能通过调用 preventDefault() 或返回 false 来阻止默认事件执行（冒泡），则应将其更改为足以与Asp.net WebForms。

3. 如果验证方面一切正常，您应该更改您的 __doPostback() 函数。是的，这听起来确实很黑客，但有时这样的事情必须要做。复制现有代码并添加额外的检查。没什么可担心的。

另请检查这个 Stackoverflow 问题。

噢，见鬼。只需对此进行 Google 搜索并仅包含 stackoverflow 结果： jQuery 验证 Web 表单网站：stackoverflow.com

Answer 4

如果我没记错的话，您可以使用常规按钮而不是 asp:button，这不会导致回发。如果是这种情况，那么您可以使用 JavaScript 来更新 UpdatePanel。