Question

我有一个HTML表单。我已经在做客户端HTML。

    <form id='myForm' onsubmit='return myFormValidation()'>
       ...
    </form>

现在，在myFormValidation函数中，确保客户端正常后，在真正提交表单之前，我还要进行服务器端表单验证。我正在使用JQuery。所以，我把我的功能改成了这样的东西：

function myFormValidation(){
  //first, client side validation
  ...
  //then, server side validation
  $.post(url_of_server_side, $("#myform").serialize(), function(json) {
    data = JSON.parse(json);
    if(!data.ok)
    {
       $("#msg").text("some error");  
    }
    else
    {
       $("#myForm").submit();//Oops!
    }
    });
    return false;
}

但是表单的“提交”功能就像一个递归函数，并试图再次验证表单！我应该在调用submit之前禁用验证功能吗？或者，我想，有一个更好的方法来解决我的问题（与此有点甚至完全不同）？

Answer 1

如果您需要服务器端验证，则应扩展您的＆＃34;保存＆＃34; enpoint以支持正确的响应状态代码，并且不使用单独的＆＃34;验证＆＃34;网址。使用具有不同响应类型的单个URL：

200（成功） - 数据已成功保存
400（错误请求） - 输入数据不正确。作为回复消息，您可以包含＆＃34;验证结果＆＃34;您将向用户显示的消息。

所以你的代码看起来像

$.post(url_of_server_side, $("#myform").serialize())
  .done(function() {
    //show some success confirmation or redirect to main page
  }).fail(function(xhr, status, error) {
    $("#msg").text(error.message);  
  });

Answer 2

如果所有数据都正常，我建议服务器端脚本执行您想要的操作，例如：保存到数据库。这样，如果一切正确，您将不需要表格的第二篇文章。如果出现问题，那么显然，检查也必须第二次进行。

在JS客户端表单验证中联系服务器

2 个答案: