Question

如果我有一个具有ajax链接的页面，并且代码返回该表单需要验证，请在哪里放置验证码。假设我的表单使用jquery验证插件进行了验证

jQuery(document).ready(function() {

  $("#basicForm").validate({

    showErrors: function(errorMap, errorList) {

      // Clean up any tooltips for valid elements
      $.each(this.validElements(), function(index, element) {
        var $element = $(element);

        $element.data("title", "") // Clear the title - there is no error associated anymore
          .removeClass("error")
          .tooltip("destroy");
      });

      // Create new tooltips for invalid elements
      $.each(errorList, function(index, error) {
        var $element = $(error.element);

        $element.tooltip("destroy") // Destroy any pre-existing tooltip so we can repopulate with new tooltip content
          .data("title", error.message)
          .addClass("error")
          .tooltip(); // Create a new tooltip based on the error messsage we just set in the title
      });
    },

    submitHandler: function(form) {

      var myselect = $('select[name=ddCustomers]');
      //alert(myselect.val());
      window.location.replace("customer.php?customer_id=" + myselect.val());
    }
  });
  $("#basicForm").removeAttr("novalidate");
});

我把它作为document.ready放在哪里我通常会将这段代码称为

我希望这是有道理的

我可以在返回表单的初始页面加载准备好的页面上

我已经读过了我已经在document.on函数中进行了验证，但是我真的不明白。我会用我的ajax响应发布这样的内容吗

$(document.body).on('click', '#basicForm', function(){
    $("#basicForm").validate({
        submitHandler: function() {
        // do whatever you need here
        } 
    }); 
});

感谢您的帮助。它令人困惑，我无法在谷歌上找到一个不错的例子

修改

我知道如何为动态生成的表单编写验证代码，所以感谢那些答案，但我没关系。问题是我应该把它放在ajax返回的代码中？也许我有一个误解，但我正在使用jquery验证模块（基本帮助（我只见过第一页上的`doc。形式验证方法准备就绪 - 从来没有ajax回发

的document.ready

选项

1）当ajax注入表单时，页面中的硬编码已经写入了吗？不够动态 - 注入的表单是动态创建的，因此验证可能需要是 2）将验证码添加到

document.on

当我为新表单执行ajax回发时？这甚至可能吗？我不是客户端程序员。

我很困惑，这种常见的场景没有设计模式。虽然我通过ajax阅读postng back表格是不好的做法，因为它可能会混淆浏览器，现在是什么ajax whs写的，所以也许为什么我找不到解决方案

感谢

Answer 1

我使用jquery编写和开发了许多Web应用程序，php是服务器端脚本。我形成的方式是在同一页面上使用jquery代码和html，因为jquery需要检查html元素并使用正确的错误消息进行响应并在提交到＆＃34; form-process之前清理所有数据字段。 PHP＆＃34;例如，如果那是您的服务器端脚本的名称。

有：

$(document.body).on('click', '#basicForm', function(){
    $("#basicForm").validate({
        submitHandler: function() {
        // do whatever you need here
        } 
    }); 
});

代码与say：create-username.html或create-username.php页面相同 HTML元素。有些人喜欢在底部放置jquery，取决于你的拥有方式页面结构化，但我喜欢把js放在旧实践的顶部，尽管有时候它并不适用于jquery。

在同一个区块中包含您的工具提示代码。我不喜欢到处都有jquery;如果出现错误，或者如果您需要在将来的参考文献中进行修改，则很难确定编辑，添加或修复代码。我希望这有帮助。

Answer 2

您需要先初始化验证插件并设置所需的规则。然后，当用户提交表单时，阻止默认表单提交行为，如果根据您设置的规则标准成功验证所有表单，则使用ajax手动将表单提交到服务器。

 $('#basicForm').validate({ // initialize the plugin
        rules: {
            field1: {
              required: true,
              email: true
          },
           field2: {
               required: true,
               minlength: 5
          }
      }
  });

$('document').on('submit', '#basicForm', function(e){   
    if($(this).valid()){
           //client side is valid, make ajax call
    }
    e.preventDefault(); 
});

验证ajax返回的表单

2 个答案: