少なくとも1つのフィールドに入力する必要があり、すべての入力は整数または小数である必要があるフォームを作成しています。jqueryの検証プラグインを使用して検証しています。ここで見つけたものを作り直しましたが、部分的にはうまくいくようです。今私は持っています:
<SCRIPT>
jQuery.validator.addMethod("require_from_group", function(value, element, options) {
var numberRequired = options[0];
var selector = options[1];
var validOrNot = $(selector, element.form).filter(function() {
// Each field is kept if it has a value
return $(this).val();
// Set to true if there are enough, else to false
}).length >= numberRequired;
if(!$(element).data('being_validated')) {
var fields = $(selector, element.form);
fields.data('being_validated', true);
fields.valid();
fields.data('being_validated', false);
}
return validOrNot;
// {0} below is the 0th item in the options field
}, jQuery.format("Please fill out at least {0} of these fields."));
$(document).ready(function(){
var container = $('#errorContainer');
$("#FORMMM").validate( {
rules: {
groceries: {digits: true,require_from_group: [1,".at_least_one"]},
gas: {digits: true,require_from_group: [1,".at_least_one"]},
hotels: {digits: true,require_from_group: [1,".at_least_one"]}
},
success: function(label) {
label.html(" ").addClass("checked");
},
errorContainer: container,
errorLabelContainer: $("ol", container),
wrapper: 'li',
meta: "validate"
});
});
</SCRIPT>
HTMLは以下のとおりです。実際の形式では、15個の入力フィールドがあります。ここでは、これを要約しています。
<form action="results.php" target="_blank" id="FORMMM">
<div style="clear:both">
<label for="groceries">Groceries</label>
<div style="float:right">
$<input name="groceries" type="text" class="at_least_one idleField"></div>
</div>
<div style="clear:both">
<label for="gas">Gas</label>
<div style="float:right">
$<input name="gas" type="text" class="at_least_one idleField">
</div>
</div>
<div style="clear:both">
<label for="hotels">Hotels</label>
<div style="float:right">
$<input name="hotels" type="text" class="at_least_one idleField">
</div>
</div>
<div id="button">
<input name="" type="submit" value="Calculate" class="calc_button" style="cursor:hand">
</div>
</form>
<div id="errorContainer">
<h4>errors</h4>
<ol>
</ol>
</div>
現在、検証には2つの問題があります。すべてのフィールドを空白のままにすると、1つだけ必要なときに3つのエラーメッセージが表示されます。
また、入力の1つに文字を入力すると、「数字のみ」のエラーメッセージが一瞬表示されますが、少なくとも1つのフィールドに入力するという2回目のテストで、入力がないことを補うため、フォームは送信されます。数字。
私はこれを完全に間違った方法で行っていますか?ここやjqueryフォーラムで見つけることができる例はどれも正確に適合していないようです。これを解決するには、どの方向に進むべきですか?