jQueryフォーム ウィザード プラグインを使用しています。それぞれに 3 つの答えがある 20 の質問があります。各回答には重みを付けることができます。各質問について、回答の重みの合計は 10 に等しくなければなりません。
<fieldset id="first" class="step">
<input type="text" size="2" maxlength="2" value="" name="question1[]" class="required"/>A: Inspiring others with a compelling vision for change.<br />
<input type="text" size="2" maxlength="2" value="" name="question1[]" />B: Engaging others to buy-into the change.<br />
<input type="text" size="2" maxlength="2" value="" name="question1[]" />C: Executing a project plan and managing accountabilities.<br />
<label for="question1[]" class="error" style="display:none;">Your values must add up to 10!</label>
</fieldset>
これは基本的に性格評価です。A と C は当てはまらないと思いますが、A には 10 を入力します。
各フィールド セットの合計が 10 になっているかどうかを確認し、そうでない場合はエラー メッセージを送信する方法はありますか?
私はjQuery検証プラグインを使用していますが、数字などをチェックすることがわかっているので、これは少し具体的すぎるようです.
必要なチェックに合格するために、以下に沿って何かを追加しようとしましたが、ここからどこに行くべきかわかりません:
$(document).ready(function() {
$("#Form").validate({
submitHandler: function(form) {
form.submit();
}
});
$("#Form input[name='question1']").each(function() {
$(this).rules("add", {
required: true,
maxlength: 2,
messages: {
required: "Required",
minlength: jQuery.format("Max length of {2} characters.")
}
});
});
});
また、jQuery 検証では、配列に対応するように関数を編集する必要があることもわかりました。以下の機能を変更しました。
checkForm: function() {
this.prepareForm();
for (var i=0, elements=(this.currentElements = this.elements()); elements[i]; i++ ) {
if (this.findByName(elements[i].name).length != undefined &&
this.findByName( elements[i].name ).length > 1) {
for (var cnt = 0; cnt < this.findByName( elements[i].name ).length; cnt++) {
this.check( this.findByName( elements[i].name )[cnt] );
}
}
else {
this.check( elements[i] );
}
}
return this.valid();
}
私もこれを試しました:
$(document).ready(function(){
$("#Form").validate({
rules: {
question1: {
required: true
}
},
submitHandler: function(form) {
form.submit();
}
});
});
これはどれも、「必要な」エラーが発生するようには機能していないようです。コンソールにエラーはありません。「次へ」ボタンが押されたときに、各質問でこれを検証する必要があります。次のボタンには がtype=submit
あるため、理論的には、少なくとも質問 1 が必要であると述べたが、役に立たないことがわかるはずです。
私もこれを試しました:
$().ready(function() {
// validate the comment form when it is submitted
$("#Form").validate({
rules: {
"question1[]": "required"
},
messages: {
"question1[]": "Input is required",
}
});
});
しかし、エラーなしで次のフィールドセットに進みます。