JQuery <select>同時驗證多個<select>

我有這種形式，它包含三個選擇框，一個爲一天，一個爲一個月和一個爲一年，並且已經嘗試了相當一段時間，現在正確驗證它。JQuery <select>同時驗證多個<select>

我有增加了一個類的<select>的父母，這樣一個綠點出現在側，以表明它是有效的方法。

現在，只要用戶僅輸入年份或月份，類「有效」設置爲即使其他領域的一個設置爲null父。

另一個問題，我有我做的東西，在中途遇到的是出生的日期是不需要驗證的形式，但如果用戶希望進入他的出生日期，他可以這樣做。

因此，我試圖實現的是僅在用戶輸入三個<select>中的至少一個時纔開始對<select>進行驗證，並且如果用戶什麼都不輸入，表單仍將被驗證。

這是我想出了迄今爲止代碼：

jQuery.validator.addMethod('selectcheck', function (value) { 
    return (value != 'null'); 
}, "value required"); 

$("#registrationform").validate({ 
    rules: { 
     dayofbirth:{selectcheck:true,}, 
     monthofbirth:{selectcheck:true,}, 
     yearofbirth:{selectcheck:true,} 
    } 
    highlight: function (element) { 
     $(element).parent().addClass('error').removeClass('valid').closest('.form-group').addClass('error').removeClass('valid'); 
    }, 
    unhighlight: function (element) { 
     $(element).parent().addClass('valid').removeClass('error').closest('.form-group').addClass('valid').removeClass('error'); 
    } 
});

我沒加的錯誤消息和其他類似的東西，因爲我這是相當irrellevant的問題。

編輯：我改變了代碼以便日期不會調用selectcheck方法，因爲我現在用這種方法只對一些其他複選框。現在我試圖想出一個只驗證日期的新方法。

來源

2013-11-28 mikkuslice

您描述的設置沒有清楚地解釋哪部分是壞的。你的'selectcheck'方法完全沒有必要......這與'required'規則完全相同。最後，顯示相應的HTML標記！ – Sparky

我不完全確定爲什麼您爲簡單的required規則可以完成的操作創建自定義方法。

如果你的HTML看起來像這樣，在第一option包含value="" ...

<select name="month" class="date"> 
    <option value="">please select month...</option> 
    <option value="1">January</option> 
    <option value="2">February</option> 
    .... 
</select>

，那麼你可以使用這個...

$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      month: { 
       required: true 
      } 
     } 
    }); 

});

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

或者，如果要驗證它們是否爲組，則可以使用the additional-methods.js file中包含的require_from_group方法。

$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      month: { 
       require_from_group: [3, '.date'] 
      }, 
      day: { 
       require_from_group: [3, '.date'] 
      }, 
      year: { 
       require_from_group: [3, '.date'] 
      } 
     }, 
     groups: { 
      dateGroup: 'month day year' 
     } 
    }); 

});

DEMO：http://jsfiddle.net/KE9SU/1/

現在使用正確的規則，它應該是更容易爲你自動瞄準和樣式的錯誤元素。

來源

2013-11-29 19:26:38 Sparky

非常感謝先生，儘管我經歷了漫長的路途，但我確實設法找到了解決方法。不幸的是，我已經提交了我的任務的最終副本，用我的方式，在那裏我創建了一個驗證Dob組的方法，因爲我有不止一個，它通過ID獲取元素並檢查是否設置了相應的日期，月份或年份爲空。還是非常感謝tho下次我一定會用你的方式:) – mikkuslice

JQuery <select>同時驗證多個<select>

回答

相關問題