当表单在 ASP.NET MVC 5 应用程序中有效时触发 jQuery 函数

Posted 2023-05-09

【中文标题】当表单在 ASP.NET MVC 5 应用程序中有效时触发 jQuery 函数

【英文标题】：Trigger jQuery function when form valid in ASP.NET MVC 5 application

【发布时间】：2018-03-22 01:48:25

【问题描述】：

我正在创建一个 ASP.NET MVC 5 应用程序。我需要编写一些 jQuery 或 javascript 在提交表单时检查应用程序的表单是否有效（使用jQuery Validate）。如果表单有效，则表单需要同时提交并显示一个警告框（暂时）。到目前为止，我已经使用this post 来雕刻我的代码，但它对我不起作用。此代码运行正常：

$('form').submit(function () 
  alert('test');
);

但这对我不起作用：

$('form').submit(function () 
  if ($(this).valid()) 
    alert('the form is valid');
  
);

我收到以下错误：

未捕获的类型错误：$(...).valid 不是函数

我不明白为什么这段代码对其他人有效，但对我却无效。我哪里错了？

如何让提交按钮在表单有效时同时显示警告框和提交表单？

【参考方案1】：

您使用的是哪个版本的 jquery？ 我遇到了同样的错误，在 chrome 浏览器的网络选项卡中检查时，我的应用程序使用的是 jquery 1.10.2。 jQuery 验证器仅适用于 1.7.2、1.8.3、1.9.1、1.11.1、3.1.1。 这是根据插件页面 - https://jqueryvalidation.org/

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.js"></script>

 <script>
    $(document).ready(function () 

    $('#sampleForm').submit(function () 
        if ($(this).valid()) 
            alert('valid');
        
        else 
            alert('not valid');
        
    );
);
</script>
<div class="jumbotron">
  <h1>ASP.NET</h1>
  <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using html, CSS and JavaScript.</p>
  <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
</div>

<div class="row">
  <form id="sampleForm">
    <input type="text" />
    <input type="submit" value="Submit" />
  </form>
</div>

如果您使用的是 VS MVC 项目，请检查 bundleConfig.cs，它会下载不同版本的 jQuery。确保它下载了所需版本的 jQuery 或注释配置中下载 jQuery 进行测试的行。