使用荷蘭芹添加自定義多重驗證

是否可以使用荷蘭芹添加自定義多重驗證（即依賴多個輸入的單一驗證）？使用荷蘭芹添加自定義多重驗證

我有時想驗證<form>或整個部分，並在該級別提供錯誤，而不是在<input>級別提供錯誤。

例如，想象一個帶有<table>的表單，它允許用戶輸入不同顏色和大小的組合。假設我想驗證沒有重複的組合。最佳方式是驗證每行的行數並在其上查找重複的行。如果找到重複的行，這些整行都是無效的，沒有任何單獨的輸入實際上無效。此外，任何領域的變化都可能導致該行或其他行無效。

如果我嘗試將"tr.combination"添加到inputs選項，<table>將不會被添加fields。看起來選項沒有傳遞給構造函數，所以它不返回ParsleyField，而是返回一個通用的Parsley對象。

我從構建ParsleyFieldMultiple更進一步，因爲選擇是硬編碼和代碼高度依賴checkbox/radio

來源

2014-11-20 Marc-André Lafortune

另一個例子是一個簡單的形式，讓用戶選擇以英寸爲單位的尺寸。第一個'select'選擇整數值，第二個'select'選擇分數值（即0.125或1/8）;目標是驗證這兩個字段的總數與另外兩個英寸輸入字段的總數。 – pspahn 2015-02-24 22:48:32

你要完成不能用香菜本身做什麼。考慮到這似乎是一個非常特殊的情況下，你可能需要以下解決方案：

而不是創建一個自定義驗證的，使用Parsley events來執行驗證
基於重複組合的存在，捏捏ParsleyForm.validationResult 。

這不是最優雅的解決方案，但我認爲這是最簡單的解決方案。其實我不認爲你可以找到這個問題的優雅解決方案。

您可以在此working jsfiddle進行測試。

// bind event after form validation 
$.listen('parsley:form:validated', function(ParsleyForm) { 
    // We only do this for specific forms 
    if (ParsleyForm.$element.attr('id') == 'myForm') { 
     var combinations = []; 

     // foreach tr 
     ParsleyForm.$element.find('tr').each(function() { 
      var tr = $(this); 

      // if there are any inputs 
      if (tr.find('input').length > 0) { 
       // Add a new combination based on tr's inputs 
       combinations.push(tr.find('input:first').val() + '|' + tr.find('input:last').val()); 
      } 
     }); 

     // sort array 
     combinations = combinations.sort(); 

     // check if there are duplicate combinations 
     for (var i = 0; i < combinations.length - 1; i++) { 
      // if two combinations are equal, show message 
      // and force validation result to false 
      if (combinations[i + 1] == combinations[i]) { 
       ParsleyForm.validationResult = false; 

       $("#form-message-holder") 
        .html('There are some errors with your form') 
        .css('display', 'block'); 
       return false; 
      } 
     } 

     // otherwise, validation result is true and hide the error message 
     ParsleyForm.validationResult = true; 
     $("#form-message-holder") 
      .html('') 
      .css('display', 'none'); 
    } 
});

來源

2014-11-21 14:22:51

使用荷蘭芹添加自定義多重驗證

回答

相關問題