У меня есть форма со многими полевыми группами. Каждая группа полей содержит много элементов div. Если при отправке формы обязательные поля не заполнены, возвращается форма с классами .error прикрепленными к незавершенным элементам.

Я хотел бы использовать jQuery для присоединения класса .error (или встроенного css в приведенном ниже примере) к каждой группе полей, которая содержит элемент, назначенный классу .error .

наценка

<h3 class="field-group-format-toggler accordion-item"><a href="#">T-Shirt Size</a></h3>
<div class="field-group-format-wrapper required-fields">
  <label for="edit-field-appl-tshirt-und">T-Shirt Size <span class="form-required" title="This field is required.">*</span></label>
  <div class="form-item form-type-radio form-item-field-appl-tshirt-und">
    <input class="form-radio error" id="edit-field-appl-tshirt-und-2" name="field_appl_tshirt[und]" type="radio" value="1"> <label class="option" for="edit-field-appl-tshirt-und-2">S</label>
  </div>
  <div class="form-item form-type-radio form-item-field-appl-tshirt-und">
    <input class="form-radio error" id="edit-field-appl-tshirt-und-3" name="field_appl_tshirt[und]" type="radio" value="2"> <label class="option" for="edit-field-appl-tshirt-und-3">M</label>
  </div>
  <div class="form-item form-type-radio form-item-field-appl-tshirt-und">
    <input class="form-radio error" id="edit-field-appl-tshirt-und-4" name="field_appl_tshirt[und]" type="radio" value="3"> <label class="option" for="edit-field-appl-tshirt-und-4">L</label>
  </div>
</div>

CSS

.error {
border: 2px solid red;
}

JQuery
Я пытался:

 $( ".accordion-item" ).find(".error").css( "border", "2px solid red" );

а также экспериментировал с .parent() и .children() но не могу понять мой синтаксис правильно. Это относится только к непосредственным потомкам?

Спасибо!

|источник

0