validacion - validar select vacio javascript

Validar cuadro de selección

Question

Estoy usando la Validation jQuery plugin para validar un formulario. Tengo una lista de selección que se ve así:

<select id="select">
<option value="">Choose an option</option>
<option value="option1">Option1</option>
<option value="option2">Option2</option>
<option value="option3">Option3</option>
</select>

Ahora, quiero asegurarme de que el usuario seleccione todo menos "Elegir una opción" (que es el predeterminado). Para que no valide si eliges la primera opción. ¿Cómo puede hacerse esto?

Answer 1

No sé cómo fue el complemento cuando se formuló la pregunta (2009), pero me enfrenté al mismo problema hoy y lo resolví de esta manera:

1. Dale a tu etiqueta de selección un atributo de nombre. Por ejemplo en este caso

   <select name="myselect">

2. En lugar de trabajar con el atributo value = "default" en la opción de etiqueta, deshabilite la opción predeterminada según lo sugerido por Jeremy Visser o configure value = ""

   <option disabled="disabled">Choose...</option>

   o

   <option value="">Choose...</option>

3. Establecer la regla de validación del complemento

   $( "#YOUR_FORM_ID" ).validate({ rules: { myselect: { required: true } } });

   o

   <select name="myselect" class="required">

Obs: la solución de redsquare funciona solo si tiene una sola selección en su formulario. Si desea que su solución funcione con más de una, seleccione agregar un atributo de nombre a su selección.

¡Espero eso ayude! :)

Answer 2

Para empezar, puede "desactivar" la opción para que los usuarios no puedan seleccionarla accidentalmente:

<option value="" disabled="disabled">Choose an option</option>

Luego, dentro de su evento JavaScript (no importa si es jQuery o JavaScript), para que su formulario valide si está configurado, haga lo siguiente:

select = document.getElementById(''select''); // or in jQuery use: select = this;
if (select.value) {
  // value is set to a valid option, so submit form
  return true;
}
return false;

O algo por el estilo.

Answer 3

Simplemente agregue una clase de requerida para la selección

<select id="select" class="required">

Answer 4

Tal vez hay un camino más corto, pero esto funciona para mí.

<script language=''JavaScript'' type=''text/javascript''>
    function validateThisFrom(thisForm) {
        if (thisForm.FIELDNAME.value == "") {
            alert("Please make a selection");
            thisForm.FIELDNAME.focus();
            return false;
        }
        if (thisForm.FIELDNAME2.value == "") {
            alert("Please make a selection");
            thisForm.FIELDNAME2.focus();
            return false;
        }
    }
</script>
<form onSubmit="return validateThisFrom (this);">
    <select name="FIELDNAME" class="form-control">
        <option value="">- select -</option>
        <option value="value 1">Visible info of Value 1</option>
        <option value="value 2">Visible info of Value 2</option>
    </select>
    <select name="FIELDNAME2" class="form-control">
        <option value="">- select -</option>
        <option value="value 1">Visible info of Value 1</option>
        <option value="value 2">Visible info of Value 2</option>
    </select>
</form>

Answer 5

desea asegurarse de que el usuario seleccione todo menos "Elegir una opción" (que es el predeterminado). Para que no valide si eliges la primera opción. ¿Cómo puede hacerse esto?

Puede hacer esto simplemente agregando el atributo requerido = "requerido" en la etiqueta de selección. puedes verlo en el código a continuación

<select id="select" required="required">
<option value="">Choose an option</option>
<option value="option1">Option1</option>
<option value="option2">Option2</option>
<option value="option3">Option3</option>
</select>

Funcionó bien para mí en chorme, firefox e internet explorer. Gracias

Answer 6

   <script type="text/JavaScript">  
function validate() 
{
if( document.form1.quali.value == "-1" )
   {
     alert( "Please select qualification!" );
     return false;
   }
}

</script>
<form name="form1" method="post" action="" onsubmit="return validate(this);">
<select name="quali" id="quali" ">
        <option value="-1" selected="selected">select</option>
        <option value="1">Graduate</option>
        <option value="2">Post Graduate</option>
      </select> 
</form>





// this code works 110% tested by me after many complex jquery method validation but it is simple javascript method plz try this if u fail in drop down required validation//

Answer 7

<select id=''bookcategory'' class="form-control" required="">
                    <option value="" disabled="disabled">Category</option>
                    <option value="1">LITERATURE & FICTION</option>
                    <option value="2">NON FICTION</option>
                    <option value="3">ACADEMIC</option>
            <option value="4">CHILDREN & TEENS</option>

                </select>

La validación de formulario HTML puede realizarse automáticamente por el navegador. Pruebe el código anterior:
El resto todo se hará automáticamente, no es necesario crear ninguna función js solo este menú desplegable y un botón enviar.

Answer 8

if (select == "") {
    alert("Please select a selection");
    return false;

Eso debería funcionar para ti. Simplemente lo hice por mí.