jQuery Validateを使用していますが、リファクタリングの問題が発生しています。<li>
ドロップダウン番号に基づいて を作成する JavaScript 関数があります。
結果<li>
の は次のように生成されます。
<li class="person-information hide" style="display: list-item; ">
<!-- First Name -->
<input type="text" class="person-name-first error" name="person-name-first">
<!-- Last Name -->
<input type="text" class="person-name-last" name="person-name-last">
<!-- Age -->
<select class="person-age valid" name="person-age">
<option value="1">Infant/Toddler (1-3)</option>
<option value="2">Child (4-17)</option>
<option value="3">Adult (18+)</option>
</select>
</li>
次に、addMethod と addClassRules を使用して、検証ルールを作成します。
$.validator.addMethod("fNameRequired", $.validator.methods.required, "First Name Required");
$.validator.addMethod("fNameMinlength", $.validator.methods.minlength, $.format("First Name must have at least {0} characters"));
$.validator.addClassRules("person-name-first", { fNameRequired: true, fNameMinlength: 2 });
私の問題は、生成された最初の要素でのみ検証エラーがスローされることです。したがって<li>
、 classに が 5 つある場合"person-name-first"
、合格しなかった最初の要素に対してのみ検証が実行されます。以下で失敗した要素は、フォーカスされるまで「エラー」クラスが追加されないことを意味します。
失敗した同一のクラスを持つすべての要素を調べる方法についてのアイデアはありますか?