jQuery Form Validator on custom fields -

i'm using script work selects. script is: jquery.selectbox-0.2

my structure is:

<select name="dpto_contato" id="dpto_contato" tabindex="1">     <option value="">selecione o departamento</option>     <option value="administração">administração</option>     <option value="financeiro">financeiro</option>     <option value="vendas">vendas</option> </select> 

but plugin, markup receives display:none, , "div" appears, replacing this, , "select box" appears way:

<div id="sbholder_36001521" class="sbholder" tabindex="1">     <a id="sbtoggle_36001521" class="sbtoggle" href="#"></a>     <a id="sbselector_36001521" class="sbselector" href="#">selecione o departamento</a>     <ul id="sboptions_36001521" class="sboptions" style="display: none;">         <li>             <a class="sbfocus" href="#" rel="">selecione o departamento</a>         </li>         <li>             <a href="#administração" rel="administração">administração</a>         </li>         <li>             <a href="#financeiro" rel="financeiro">financeiro</a>         </li>         <li>             <a href="#vendas" rel="vendas">vendas</a>         </li>     </ul> </div> 

i'm using jquery, validator:

$("#form_contato").validate({     rules: {           dpto_contato: { required: true },         nome: { required: true, minlength: 2 },          email: { required: true, email: true },         telefone: { required: true },         assunto: { required: true },         mensagem: { required: true }     },       messages: {         dpto_contato: { required: 'selecione o departamento'},         nome: {  required: 'informe o seu nome', minlength: 'no mínimo 2 letras' },          email: { required: 'informe o seu email', email: 'informe um email válido' },         telefone: { required: 'informe seu telefone'},         assunto: { required: 'informe o assunto'},         mensagem: { required: 'escreba sua mensagem'},      },       showerrors: function(errormap, errorlist) {         $("#form_contato").find("input").each(function() {             $(this).removeclass("error");         });         $("#myerrorcontainer").html("");         if(errorlist.length) {             $("#myerrorcontainer").html(errorlist[0]['message']);             $(errorlist[0]['element']).addclass("error");         }     },     submithandler: function( form ){         $("#myerrorcontainer").hide();         $("#enviando").show();         var dados = $( form ).serialize();           $.ajax({               type: "post",               url: "paginadeenvio.php",             data: dados,               success: function( data )               {                   alert('email enviado com sucesso!. em breve entraremos em contato');                 $("#form_contato")[0].reset();                 $("#enviando").hide();              }           });            return false;       }            }); 

so question is: how apply validation in select?

by default, jquery validate ignores hidden input elements.

to validate hidden element using jquery validate plugin, must set ignore option [] disables default behavior.

$("#form_contato").validate({     ignore: [],     rules: {         ... 

also see: https://stackoverflow.com/a/8565769/594235