带有表单提交的AJAX验证

Question

如何使用AJAX jquery表单提交来验证字段？这是要提交的jquery代码，我有一个要验证的javascript文件。

  $("#submit").click(function(e) {
  e.preventDefault();
  var proc = $("#proc").val(); 
  var proc_date = $("#dp3").val();
  var supervisor = $("#name5").val();
  var mrn = $("#username4").val();
  var note = $("#note").val();
  var dataString = 'proc='+proc+'&supervisor='+supervisor+'&mrn='+mrn+'&note='+note;
  $.ajax({
    type:'POST',
    data:dataString,
    url:'procedure_log_result.php',


success:function(data) {
  //alert(data);

  location.reload(true);
    }
  });
});

这里是位于的javascript文件（js / procedure_log / PL_validate.js）

    'use strict';
$(document).ready(function() {
    $('.popup-validation').validationEngine();
    Admire.formValidation();
    $(".error_color").append('<br/>');
    $(".form_val_popup_dp1").datepicker({
        todayHighlight: true,
        format: 'yyyy-mm-dd',
        autoclose: true
    });

我的问题的第二部分是如何创建自定义验证？例如，我有一个选择输入，该输入具有禁用的选项“选择过程”。但是，如果我没有选择就提交，则会将“选择过程”误认为是选择的选项。因此，我想进行拒绝“选择过程”的自定义验证。

Answer 1

您是否考虑过使用Jquery验证？

查看此答案：https://stackoverflow.com/a/15072147/12113934

您需要进行验证，然后在验证功能的成功部分中包括AJAX功能。

编辑

$("#submit").click(function(e) {
   e.preventDefault();
   $('#myform').validate({ // initialize the plugin
    ignore: ":disabled",
    rules: {
        ".form_val_popup_dp1": {
            required:true
           }
    },
    submitHandler: function(form) {
        var proc = $("#proc").val(); 
        var proc_date = $("#dp3").val();
        var supervisor = $("#name5").val();
        var mrn = $("#username4").val();
        var note = $("#note").val();
        var dataString = 
          'proc='+proc+'&supervisor='+supervisor+'&mrn='+mrn+'&note='+note;
        $.ajax({
          type:'POST',
          data:dataString,
          url:'procedure_log_result.php',
        }
    });
 });

这将忽略所有禁用的字段，并且一旦您的代码有效，它将触发submitHandler函数。