没有模型绑定的 Asp.Net MVC 5 客户端验证

Question

我的 mvc 视图中有以下输入

 <input class="input-group-field" id="name" name="name" type="text" size="1" required="">
 <input class="input-group-field" id="email" name="email" type="email" size="1" required="">

我的 MVC 视图只处理 ajax 请求，没有模型绑定。

我的 Ajax 请求在按钮单击事件上被触发。

我知道没有表单标签，html 5 验证不起作用。

我试图围绕输入设置一个表单并阻止表单被提交。

    $('#valForm').submit(function (e) {

        e.preventDefault();

    });

按钮：

<button class="button green post" type="submit">Submit</button>

但是按钮的点击事件仍然被触发。

  $('.button.post').on('click', function () {
    //fires
  });

如果我将按钮侦听器从单击更改为提交，则不会发生任何事情。

  $('.button.post').on('submit', function () {
    // does not fire fire
  });

我知道如何在不实际提交表单的情况下触发客户端 html5 验证吗？

谢谢

Answer 1

您可以通过几种不同的方式解决此问题。我不知道你是如何定义你的表单/表单标签的，但是自从你发布了你的按钮，我可以看到为什么你的点击事件没有被捕获。您的选择器错误。

这个选择器

$('.button.post')

将 anthing 与课程按钮和课程帖子相匹配。您的按钮没有类按钮，因此您应该将选择器更改为

$('button.post')

改为。

更新：我重读了您的帖子。您的按钮处理程序似乎已经被触发，这意味着您在此处发布问题时可能打错了。您还想在不合并页面的情况下触发 html5 验证。

你应该得到这样的结果：

$('form').on("submit", function(e) {
  e.preventDefault();
});