如果在ASP.NET MVC 5应用程序中提交有效格式，是否触发模式? [英] Trigger modal if submitting valid form in ASP.NET MVC 5 application?

问题描述

我正在创建一个ASP.NET MVC 5应用程序.用户单击提交"按钮与要加载的下一页之间有很长的等待时间，因此，我希望仅当用户提交有效的弹出请等待"模式形式.

I am creating an ASP.NET MVC 5 application. There is a long wait time between the user clicking the "submit" button and the next page to load, so I would like a "please wait" modal to pop up only if the user has submitted a valid form.

我尝试了以下代码，无论表单是否有效，该模式都会弹出模式:

I have tried the following code, which causes the modal to pop up no matter if the form is valid or not:

$('form').submit(function () {
    $('#waitingModal').show();
});

我的应用程序利用了创建MVC应用程序时都附带的jQuery Validate插件和无干扰的验证，因此我尝试了以下代码:

My application utilizes the jQuery Validate plugin and unobtrusive validation which both came with creating a MVC application, so I tried this code:

$('form').submit(function () {
    if ($(this).valid()) {
      $('#waitingModal').show();
    }
});

但是我遇到以下错误:

TypeError:$(...).valid不是函数

TypeError: $(...).valid is not a function

NuGet管理器表示我正在使用jQuery版本1.11.1，jQuery Validate 1.11.1和jQuery Unobtrusive 3.2.3.

The NuGet Manager says that I am working with jQuery version 1.11.1, jQuery Validate 1.11.1, and jQuery Unobtrusive 3.2.3.

我在代码中缺少什么吗?还有另一种方法吗?

Am I missing something in my code? Is there another approach?

推荐答案

感谢您的评论和

Thanks to your comments and this post, I was able to solve my problem. Posting a solution here for anyone else who runs into this issue...

我在代码中添加了.validate()，如下所示:

I added .validate() to my code like so:

$('form').submit(function () {
  $(this).validate();
  if ($(this).valid()) {
     $('#waitingModal').show();
  }
});

但遇到相同的错误:

TypeError:$(...).validate不是函数

TypeError: $(...).validate is not a function

在谷歌搜索并找到这篇文章之后，我想我会尝试重新排列我的脚本标签.即使我的jQuery脚本标签位于Layout.cshtml中，我也需要将脚本标签移动到窗体视图上脚本标签列表底部的jQuery Validate.现在，模态正完全弹出我想要的样子.

After Googling and finding this post, I thought I'd try rearranging my script tags. Even though my jQuery script tag resides in my Layout.cshtml, I needed to move my script tag to jQuery Validate on the form's view to the bottom of the script tag list. Now the modal is popping up exactly how I would like it to.

编辑

根据另一位用户的评论，我删除了.validate();.从我的代码.所以我的代码又回到了这一点:

Per another user's comment, I removed .validate(); from my code. So my code is back to this:

$('form').submit(function () {
  if ($(this).valid()) {
     $('#waitingModal').show();
  }
});

就像用户所说的那样，代码在没有.validate()的情况下运行得很好.原来我唯一的问题是脚本标记的顺序.

Just as the user said, the code ran perfectly fine without the .validate(); Turns out my only issue was the order of my script tags.

这篇关于如果在ASP.NET MVC 5应用程序中提交有效格式，是否触发模式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！