Question

我正在尝试将一些数据从我的AJAX表单发送到我的Node.js服务器。

$(function () {
  $('#submit').click(function (e) {
    e.preventDefault() // prevents the form from being submitted
    var data = {};
    data.id = $("#id").val();
    data.title = $("#title").val();
    data.content = $("#content").val();
    data.author = $("#author").val();
    data.email = $("#email").val();

    $.ajax({
      type: 'POST',
      data: JSON.stringify(data),
      contentType: 'application/json',
      url: '/server',
      success: function (data) {
        console.log('success');
        console.log(JSON.stringify(data));
      }
    });
  });
});

我遇到的问题是，我只希望在填写完所有字段后提交表单，但即使我已将required放在input标记上，我仍然会在控制台上看到消息这个过程是成功的。

如何阻止这种情况？我只希望使用所有字段的值提交表单。

Answer 1

required属性适用于您使用JavaScript绕过的标准表单提交。

鉴于您的现有代码单独获取每个字段，最简单的更改可能是循环遍历您创建的data对象中的属性：

for (k in data) {
   if ($.trim(data[k]) === "") {
      alert("All fields must be filled.");
      return false;
   }
}

请注意，我已使用$.trim() function，因此用户无法通过输入空格字符来避免您的验证。

只有在所有字段填写AJAX POST后才允许提交表单

1 个答案: