Select that I can not validate with javascript in semantic ui

1

I have in a form, three SELECT two of them are multiple and one is a simple select. I am using the semantic ui forms validation system. I can validate all the fields, but there is only one that does not validate me.

<div class="field">
    <label>País:</label>
    <select id="paisnom" class="ui fluid search dropdown" name="paisnom" required>
         <option value="0"></option>
         <?php
         $conexion = new Conexion();
         $stmt = $conexion -> prepare("SELECT paiscod, paisnom FROM paises ORDER BY paisnom");
         $stmt->execute();

         while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
         if ( $row['paiscod'] == $pais ) { ?>
            <option value = "<?php echo $row['paiscod']?>" selected><?php echo ($row['paisnom'])?></option>
         <?php } else { ?>
             <option value = "<?php echo $row['paiscod']?>"><?php echo ($row['paisnom'])?></option>
         <?php }
         }?>
    </select>
    </div>

That way I charge the country select ... and then how it's valid

dropdown3: {
            identifier  : 'paisnom',
            rules: [{
                type   : 'empty',
                prompt : 'Por favor, tiene que elegir un país de residencia'
            }]
        },

thus valid one of the other two select

dropdown2: {
            identifier : 'intereses[]',
            rules: [{
                type   : 'empty',
                prompt : 'Por favor, elija algunos temas de su interés'
            }]
        },

has the right brackets at the end because it is a multiple select
What could be happening?
Any suggestions?

    
asked by MNibor 03.10.2017 в 17:03
source

1 answer

1

If you look at the example of the documentation , so that validation of empty work, the value of the field must be really empty, in this case, it would be <option value=""></option> :

$('.form')
  .form({
    on: 'blur',
    fields: {
      dropdown: {
        identifier  : 'dropdown',
        rules: [
          {
            type   : 'empty',
            prompt : 'Please select a dropdown value'
          }
        ]
      }
    }
  })
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.js"></script>
<form class="ui form">
  <div class="field">
    <label>País</label>
    <select class="ui dropdown" name="dropdown">
      <option value="">Selecciona</option>
      <option value="arg">Argentina</option>
      <option value="col">Colombia</option>
      <option value="mex">Mexico</option>
    </select>
  </div>
  <div class="ui submit button">Enviar</div>
  <div class="ui error message"></div>
</form>
    
answered by 05.10.2017 / 20:15
source