jQuery Validate：在 ASP.NET MVC 5 应用程序中添加事件以提交按钮单击

Posted 2023-05-09

【中文标题】jQuery Validate：在 ASP.NET MVC 5 应用程序中添加事件以提交按钮单击

【英文标题】：jQuery Validate: Add events to submit button click in ASP.NET MVC 5 Application

【发布时间】：2018-03-21 22:29:57

【问题描述】：

我正在创建一个 ASP.NET MVC 5 应用程序。该应用程序已经在使用随 MVC 应用程序提供的 jQuery Validate 插件。目前，当点击“提交”按钮时，会触发jQuery Validate，如果有效则表单被验证并提交。

我需要向提交按钮单击添加更多事件，并且我需要确保新事件不会覆盖 jQuery Validate 插件。最初我在没有 jQuery Validate 的情况下尝试了这段代码：

$('#submitButton').click(function()
  // javascript event
 // another JavaScript event
);

但是当我测试这段代码时，它完全覆盖了 jQuery Validate 插件，我的所有前端验证都消失了。我想知道我是否以某种方式将 jQuery Validate 包含在此代码中，它将允许插件和新的提交按钮事件共存。

我想象代码看起来像这样：

$('#submitButton').click(function()
   //Initialize jQuery Validate plug-in
  // JavaScript event that happens if form is valid
 // another JavaScript event that happens if form is valid
);

如何调用已经由 ASP.NET 的 MVC 框架设置的 jQuery Validate？我根本不需要更改插件（除非我的行动计划是错误的）；我只需要将事件添加到提交按钮点击。

【问题讨论】：

所以目前 jQuery 验证代码有效，对吗？而您只是想向按钮添加点击事件处理程序？好吧，您所展示的确实是按钮的单击事件处理程序。这在某种程度上不起作用吗？我不太清楚你卡在哪里了。

嗨，David，当我尝试在不初始化 jQuery Validate 插件的情况下创建此 jQuery 代码时，应用程序停止了验证。我认为新代码覆盖了插件。我想知道如果我在上面的代码中调用插件，它会起作用。但是，我不确定该代码会是什么样子。

“初始化 jQuery 验证插件”是什么意思？这不是页面代码中其他地方的“初始化”吗？为什么需要再次初始化？简单地添加一个点击处理程序不会覆盖任何东西。但是，如果您有其他代码以某种方式导致问题，根据提供的信息，我们无法知道。

似乎 jQuery Validate 中必须有另一段代码已经在单击提交按钮时执行了操作。我猜这都是前端验证。当我尝试做一个单独的， $('#submitButton').click(function() // JavaScript 事件 // 另一个 JavaScript 事件 );它完全覆盖了 jQuery Validate 插件，我所有的前端验证都消失了。

你不能多次初始化这个插件。在第一次初始化之后，它将忽略任何后续尝试。

【参考方案1】：

太棒了.. 我认为您正在尝试 SUBMIT 使用

创建的表单

@using (Ajax.BeginForm.. or @using (html.BeginForm(..

这两个都包含一个函数OnBegin，它可以调用任何将在表单提交之前触发的函数

   @using (Ajax.BeginForm("SaveInformation_Basic", "..//ARCSL1", null, new AjaxOptions  HttpMethod = "POST", OnSuccess = "done._afterEntry", OnBegin = "return Prevalidateform();" , new  @id = "entryForm" ))


function Prevalidateform() 
   // do your thing here

【参考方案2】：

你可以在按钮事件中验证它

    $('#submitButton').click(function()
      var $form = $('form');
      if($form.valid())
      // JavaScript event that happens if form is valid
      
      else    // another JavaScript event that happens if form is valid
      
    );