Validating select with jquery.validate

1

I am creating a form for registration where there are some selects, such as course choice and date of birth, I would like to know how do I make it mandatory for the user to select something using this library jquery.validate

<select name="cursos_categoria" id="cursos_categoria">
  <option>Selecione a categoria de cursos</option>
  <option value="Imersão">Imersão</option>
  <option value="Aperfeiçoamento">Aperfeiçoamento</option>
  <option value="Especialização">Especialização</option>
  <option value="Superior">Superior</option>
  <option value="Outros">Outros</option>
</select>
    
asked by anonymous 22.03.2016 / 14:47

2 answers

3

Sérgio, to use jquery.validate is very simple, you just need to include the required class in your element and in js call the plugin by passing the selector that is your form.

Example:

<form id="registerForm">
  <select name="cursos_categoria" id="cursos_categoria" class='required'>
    <option value="">Selecione a categoria de cursos</option>
    <option value="Imersão">Imersão</option>
    <option value="Aperfeiçoamento">Aperfeiçoamento</option>
    <option value="Especialização">Especialização</option>
    <option value="Superior">Superior</option>
    <option value="Outros">Outros</option>
  </select>
</form>

And then:

 $("#registerForm").validate();

Note the following, your first option is understood as a valid option, so you make the plugin understand that this option is informative only put the value attribute and leave it with no value.

See working at jsfiddle

    
22.03.2016 / 15:03
0

use the following code:

link

<form method="post" action="" id="myform">
  <select name="listaopt" id="OptList">
    <option value="selecione...">selecione</option>
    <option value="option 1">option 1</option>
    <option value="option 2">option 2</option>
    <option value="option 3">option 3</option>
    <option value="option 4">option 4</option>
  </select>
  <br>
  <br>
  <input type="submit" value="enviar">
</form>

JS:

$('#myform').validate({
  rules: {
    listaopt: {
      required: true
    }
  }
});

You can find this in the documentation: link

    
22.03.2016 / 15:00