Как с помощью jquery validate провалидировать кастомный select?

Question

[sergey]

С помощью jquery сделана кастомизация обычного select, в разметке это выглядит так:

<div class="select-wrapper">
  <div class="styled-dropdown">
    <p>Choose a Group...</p>
    <ul class="styled-dropdown-list" style="display: none;">
     <li id="">Choose a Group...</li>
     <li id="35">text1</li>
     <li id="34">text2</li>
     <li id="36">text3</li>
   </ul>
  </div>

  <select class="activity-group-dropdown conditional-dropdown error" required="required" 
 name="activity[activity_group_id]" id="activity_activity_group_id" style="display: none;" 
 aria-required="true">
   <option value="">Choose a Group...</option>
   <option value="34">text1</option>
   <option value="35">text2</option>
   <option value="36">text3</option>
  </select>
</div>

$('form').validate(
      {
        ignore: [],
        rules:
        {
          name:
          {
            required: true
          }
        }
    });

с помощью jquery.validate хочу на form повесить валидацию, она срабатывает для select добавляется класс error (но у него свойство display: none и соответственно ничего не отображается) как повесить этот класс error на styled-dropdown?

Comments

[Евгений]

Но плагин всё равно куда то данные подставляет при выборе значения, вот это и валидируйте

[sergey]

Евгений, к сожалению сам select новый преобразованый строиться на ruby on rails, а мне на уже сформированый и отрендериный кусок кода нужно повесить валидацию

[Евгений]

invited, я понял, но когда вы выбираете значение из селект, что происходит? Может там скрытый инпут появляется или скрытому select присваивается значение, проверьте в консоле

[sergey]

Евгений, присваивается value option, сейчас все работает в коде но не визуально: я с помощью:

$('form').validate({
       ignore: [],
       invalidHandler: function(form, validator) {
         if (validator.numberOfInvalids()) {
           for (var i = 0; i < validator.errorList.length; ++i) {
             //alert(validator.errorList[i].element.getAttribute('name'));
             console.log(validator.errorList[i]);
           }
         }
       }
     });

выловил все ошибки которые в форме (не заполненые поля) и если я сделаю select видимым то все и будет работать но мне то нужно работатьс кастомным ина нем ошибку показывать а не на скрытом select)