0

我想使用 jQuery.Form/Validate 插件只允许在任何输入实际更改时提交我的表单。

对此有回调逻辑：http beforeSubmit:: //jquery.malsup.com/form/#options-object。但是，我似乎无法让它工作。

这是我到目前为止所拥有的：

$(document.body).on('click', 'input[type="submit"]', function(){
 var $form =$('form');

$form.validate({
  submitHandler: function($form) {
   $($form).ajaxSubmit({
  beforeSubmit: function(arr, $form){           
      var value = '', storedValue='';
      $($form+':input').each(function (index, el) {
  value=$(el).val();
  storedValue=$(el).data("stored");            
      if(value!=storedValue){
      console.log("Changed");   return true;
  } 
      else {
      return false; console.log("NOT changed");
  }
});   

...success handling, etc..

beforeSubmit: function(arr, $form) { 
  var value = '', storedValue='';
  $($form+':input').each(function (index, this) {
    value=this.value;
    storedValue=$(this).data("stored");            
        if(value!=storedValue){
          console.log("Changed");return true;
        } 
        else {
         return false; console.log("NOT changed");
        }
  });                   
}

这是HTML：

<form id="myForm">
  <input data-stored="my title" value="my title"/>
  <textarea data-stored="my description">my description</textarea>
  <input type="submit" value="submit/>
</form>

目前console.log 显示，"Changed"无论是否storedValue等于输入。

4

1 回答 1

1

首先，它永远不会显示“未更改”，因为它returns false在到达那部分之前。您也应该过滤掉提交按钮，因为您可能没有检查它的值。

$($form+':input').not(':submit').each(function(index, this) {
    value = this.value;
    storedValue = $(this).data("stored");
    if (value != storedValue) {
        console.log("Changed");
        return true;      
    }
    else {       
        console.log("NOT changed");
        return false;
    }
});

更新 在@wirey 的大力协助下，我们（@timrpeterson 和@wirey）一起制定了一个解决方案。我没有在循环中返回真/假each()，而是增加了一个值 , totalChanged, 并在循环之后评估each()它是否大于 0。

这是代码：

beforeSubmit: function(arr, $form){   
var value = '', storedValue='', totalChanged=0;
$('#myForm :input').not(':submit,:hidden').each(function (i, el) {
  //console.log($(this));
    console.log($($form));
    value=$(el).val(); 
    storedValue=$(el).data("stored");          
    if (value != storedValue) {  
      totalChanged++;    
    }
    else {     
    }
}); //each

  if(totalChanged>0){
     console.log("at least one changed");
     return true;
  }
  else{
     console.log("All NOT changed");
     return false;
  }
} //beforeSubmit
于 2012-06-11T17:12:11.977 回答