Select requerido HTML5

Middrel · #1 (**permalink**) 04/04/2014, 11:30

Hola, buenos días...

Tengo una duda, se supone que si configuras un select como requerido en HTML5 no funciona, o al menos eso me ha pasado a mi. Por ejemplo:

Código HTML:

<select name="algo" id="algo" required>
    <option value="">Nada</option>
    <option value="1">Algo</option>
    <option value="2">Algo más</option>
</select>

Si selecciono "Nada" y le doy en enviar a un formulario, pasa y no me marca que el select debe ser requerido.

Sin embargo estaba viendo un ejemplo en la página de http://www.w3schools.com/ en el ejemplo de los select http://www.w3schools.com/tags/tryit....elect_required y si pongo el siguiente código:

Código HTML:

<!DOCTYPE html>
<html>
<body>

<form action="demo_form.asp">
<select required>
  <option value="">Sin valor</option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<input type="submit">
</form>

<p><b>Note:</b> The required attribute is not supported in any of the major browsers.</p>

</body>
</html>

y le doy en tratar (try), seleccionando la opción "Sin valor", si me aparece el mensaje de que este campo es requerido.

Ya sé que con javascript, php o jquery se puede hacer esto, pero me gustaría saber si es posible lograrlo con HTML5, porque a mi nunca me ha funcionado.

De antemano, les agradezco por sus comentarios.

Saludos y buen viernes!!

PHPeros · #2 (**permalink**) 04/04/2014, 13:10

Pues si el "Try It" de W3Schools funciona, significa que funciona en tu navegador, se trata de un iframe.

No te olvides de la definición del Doctype:

<!DOCTYPE html>

Middrel · #3 (**permalink**) 04/04/2014, 13:24

Localicé el error que tenía...

Yo tengo esto configurado en el select:

Código HTML:

<select name="estado" id="estado" class="input-type-d" required >
       	<?php include("reglas/estados.php"); ?>
</select>

y en estados.php

Código HTML:

<option value="<?php if(isset($row_20)){ echo $row_20; } else { echo '0'; } ?>"><?php if(isset($row_20)){ echo $row_20; } else { echo 'Estado *'; } ?></option>
<option value="Aguascalientes" >Aguascalientes</option>
<option value="Baja California Sur" >Baja California Sur</option>
<option value="Baja California" >Baja California</option>
<option value="Campeche " >Campeche </option>
<option value="Coahuila" >Coahuila</option>
<option value="Colima" >Colima</option>
<option value="Chiapas" >Chiapas</option>
<option value="Chihuahua" >Chihuahua</option>
<option value="Distrito Federal" >Distrito Federal</option>
<option value="Durango" >Durango</option>
<option value="Guanajuato" >Guanajuato</option>
<option value="Guerrero" >Guerrero</option>
<option value="Hidalgo" >Hidalgo</option>
<option value="Jalisco" >Jalisco</option>
<option value="Estado de México" >Estado de México</option>
<option value="Michoacán" >Michoacán</option>
<option value="Morelos" >Morelos</option>
<option value="Nayarit" >Nayarit</option>
<option value="Nuevo León" >Nuevo León</option>
<option value="Oaxaca" >Oaxaca</option>
<option value="Puebla" >Puebla</option>
<option value="Querétaro" >Querétaro</option>
<option value="Quintana Roo" >Quintana Roo</option>
<option value="San Luis Potosí" >San Luis Potosí</option>
<option value="Sinaloa" >Sinaloa</option>
<option value="Sonora" >Sonora</option>
<option value="Tabasco" >Tabasco</option>
<option value="Tamaulipas" >Tamaulipas</option>
<option value="Tlaxcala" >Tlaxcala</option>
<option value="Veracruz" >Veracruz</option>
<option value="Yucatán" >Yucatán</option>
<option value="Zacatecas" >Zacatecas</option>

entonces, cuando no selecciono nada el valor es "0", lo que significaba "no vacío", por ello no aparecía el mensaje :/

Era un error que venía arrastrando desde hace mucho y no lo había localizado.

Gracias por cierto PHPeros por tu comentario!! ^^