如何分組驗證動態字段？

如果任何生成的字段爲空，我正在生成我想要顯示自定義錯誤消息的窗體區域。如何分組驗證動態字段？

我生成的代碼看起來像這樣

<input type="text" id="Field1" name="Generated" /> 
<input type="text" id="Field2" name="Generated" />

等等

而我的驗證碼是像這樣

$('#myform').validate({ 
    rules: { 
     Generated: { 
      required:true 
     } 
    }, 
    messages: { 
     Generated: { required : "Custom message." } 
    }, 
    groups: { 
     GeneratedGroup: "Generated" 
    }, 
    errorPlacement: function(error, element){ 
     if (element.attr("name") == "Generated"){ 
      $('#bottomOfGeneratedSectionDiv').append(error); 
     } else { 
      error.insertAfter(element); 
     } 
    } 
});

如果所有生成的字段爲空，驗證失敗並顯示錯誤消息。
如果填寫了任何一個字段，驗證通過並提交表單，這是意想不到的行爲。

如何分組驗證動態字段？

編輯
使用sparkies help和我的新errorPlacement代碼。
這應該完成我的目標。

errorPlacement: function(error, element){ 
     if (element.attr("name").indexOf("Generated") >= 0){ 
      $('#bottomOfGeneratedSectionDiv').empty(); 
      $('#bottomOfGeneratedSectionDiv').append(error); 
     } else { 
      error.insertAfter(element); 
     } 
    }

來源

2013-04-02 Biff MaGriff

我會建議使用自定義選擇：http://stackoverflow.com/questions/15749419/jquery-validate-with-custom-selectors-and-logic但是我無法得到它工作http://jsfiddle.net/basarat/AnhPq/ – basarat

名稱必須是唯一的，並且向組添加字段的語法是錯誤的。檢查文檔 –

字段名必須是唯一的這個插件才能正常工作。

HTML：

<input type="text" id="Field1" name="Generated1" /> 
<input type="text" id="Field2" name="Generated2" />

jQuery的：

$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      Generated1: { 
       required:true 
      }, 
      Generated2: { 
       required:true 
      } 
     }, 
     messages: { 
      Generated1: { 
       required: "Custom message." 
      }, 
      Generated2: { 
       required: "Custom message." 
      } 
     }, 
     groups: { 
      GeneratedGroup: "Generated1 Generated2" 
     } 
    }); 

});

DEMO：http://jsfiddle.net/xCY4T/

要添加規則動態添加字段，您將在創建字段後立即使用the rules('add') method。（據我所知，有一個動態添加groups選項都沒法）

$('[name="Generated2"]').rules('add', { 
    required:true, 
    messages: { 
     required: "Custom message." 
    } 
});

或者一次爲許多新的領域，用「始於」選擇和.each ...

$('[name^="Generated"]').each(function() { 
    $(this).rules('add', { 
     required:true, 
     messages: { 
      required: "Custom message." 
     } 
    }); 
});

簡單的演示這種方法的：http://jsfiddle.net/xCY4T/1/

另一種方法是創建一個class使用the addClassRules method。

$.validator.addClassRules("GeneratedRule", { 
    required: true 
});

然後，當你創建新的領域，確保他們每個都包含沿着class="GeneratedRule"具有獨特name，當然。

<input type="text" name="Generated1" class="GeneratedRule" /> 
<input type="text" name="Generated2" class="GeneratedRule" />

這種方法很簡單，但我看不到默認消息。

簡單的演示：http://jsfiddle.net/xCY4T/2/

來源

2013-04-02 14:47:50 Sparky

的組部分，那麼如何將這個寫入'n'個生成的字段呢？ –

@BiffMaGriff，生成字段的代碼必須確保創建唯一名稱，然後調用規則（'add'）'方法將規則添加到新字段。查看我的編輯。 – Sparky

如何分組驗證動態字段？

回答

相關問題