【问题标题】:Form Validation with ajax request使用ajax请求进行表单验证
【发布时间】:2015-08-25 05:26:04
【问题描述】:

我的应用程序有一个通用的验证方法validateFields。该脚本将检查需要针对多个条件进行验证的每个字段并增加计数器。

if(validate_for_nil(field) == true){
  // return true and continue other validations
} else { 
  //stop further actions and raise error
}
if(validate_max_chars(field) == true){
  //continue other validations
}else{
  //stop and raise error
}

同样对于唯一性验证,我需要发送一个 ajax 请求。但问题是,我的函数没有等待 ajax 响应。它将检查条件 undefined 作为 ajax 响应。如何让我的整个函数等待 ajax 响应到来? ajax 请求中的 Async:false 对我来说不方便。请帮忙 这是我的代码:

function form_validation() {
   $("[data-required=true]:visible").each(function(){
      element = $(this); 
      errors = validate_fields(element);
      total_errors = total_errors + errors;
  }) 
  if(total_errors == 0) {
     //submit form
  }else{
    //do nothing
  }
}

function validate_fields(field) {
   error = 0
   if(validate_for_nil(field) == true){
      // return true and continue other validations
   } else {
     error = error+1
     raise_error()
   }
   if(validate_max_chars(field) == true){
      //continue other validations
   }else{
      //counter increment and raise error
   }
   if(validate_uniqueness(field) == true) { // this method calls an AJAX request
     // return true
   }else {
      // counter increment and raise error 
   }
}

【问题讨论】:

标签: jquery ajax validation


【解决方案1】:

使用 ajax 成功/错误函数:

$.ajax({ cache: false,
    url: "some url",
    data: {  },
    success: function (data) {
       //do stuff here
    },
    error: function (ajaxContext) {
        alert(ajaxContext.responseText)
    }
});

【讨论】:

  • 实际上我正在将成功响应发送给其他一些功能。但是该函数不会等待此响应执行,我无法更改流程,因为有许多其他函数使用相同的
  • 您希望在 ajax 完成后调用 validate_fields() 吗?
  • 我希望 validate_fields 等到 validate_uniqueness() 给出未定义以外的响应
  • 为什么不把 validate_fields() 移到成功:AJAX 的函数(数据)
  • 可能存在不需要唯一性检查的情况。对于该字段,应执行所有其他检查
【解决方案2】:

如果您不想做那么多硬话,只需让 3rd 方插件自己处理所有客户端验证

我会推荐

https://reactiveraven.github.io/jqBootstrapValidation/

JqBootstrapValidation

  1. 免费使用
  2. 帮助进行所有验证
  3. 自定义验证,例如(最小、最大、最大检查、最小检查、电子邮件正则表达式等)
  4. 仅在客户端验证成功时调用您的 ajax(成功方法回调)
  5. 更多好处

一旦插件完成所有客户端验证,使用 ajax 调用来处理重复检查、唯一性等等等。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-02-17
    • 2013-01-11
    • 2011-07-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多