Wybór2 & JqueryValidator styl problem

Question

Używam this library i jquery.validate bibliotekę, i mam problem w stylu: normalnie błąd powinno być pod selectList.
mój kod JS:

errorElement: 'p', 
     errorClass: 'help-block', 
     errorPlacement: function(error, element) { 
      if(element.parent('.form-group').length) { 

       error.insertAfter(element.parent()); 
      } else { 
       error.insertAfter(element); 
      } 
     }, 
     highlight: function(element) { 
      $(element).closest(".form-group").addClass("has-error").removeClass("has-success"); 
      $(element).parent().find('.form-control-feedback').removeClass('glyphicon-ok').addClass('glyphicon-remove'); 
     }, 
     unhighlight: function(element) { 
      $(element).closest(".form-group").removeClass("has-error").addClass("has-success"); 
      $(element).parent().find('.form-control-feedback').removeClass('glyphicon-remove').addClass('glyphicon-ok'); 
     }, 

HTML kod:

<div class="form-group has-feedback"> 
         <label for="brands" class="col-sm-2">Brand :</label> 
         <div class="col-sm-9"> 
          {!! Form::select('brands', $brandsArray, 'default' , ['class' => 'form-control combobox', 'id'=>'brands']) !!} 
         </div> 
         <div class="col-sm-1"> 
          <!-- <a href="#" title="Add new brand" data-toggle="modal" data-target="#brandModal"><i class="fa fa-plus"></i></a> --> 
          <button type="button" class="btn btn-xs" title="Add new brand" id="addBrandLogo"><i class="fa fa-plus"></i></button> 
         </div> 
        </div> 

HTML kod pokojowe błędu:

<div class="col-sm-9"> 
<select name="brands" id="brands" class="form-control combobox select2-hidden-accessible" tabindex="-1" aria-hidden="true" aria-required="true" aria-describedby="brands-error" aria-invalid="true"><option selected="selected" value="">...</select> 
<p id="brands-error" class="help-block">Please enter brand name</p> 
<span class="select2 select2-container select2-container--default" dir="ltr" style="width: 497px;"><span class="selection">...</span></span> 
</div> 

Answer 1

To jest mój kod, aby rozwiązać problem:

errorPlacement: function(error, element) { 
       if(element.parent('.form-group').length) { 
         error.insertAfter(element.parent()); 
       } else { 
        //check if the element name is the select2 input 
        if (element.attr('name') == "brands") 
         //instead of insetring after the element directly 
         // insert the error after the next tag of element, after the select2 span. 
         error.insertAfter(element.next()); 
        else 
         error.insertAfter(element); 
       } 
      },