2009-08-27 22 views
7

¿Cómo se puede desactivar el envío -botón si hay uno o más de entrada -fields vacío?Para deshabilitar un botón de envío si los campos vacíos por jQuery

Mi intento de pseudo-código

if ($("input:empty")) { 
    $("input:disabled") 
} 
else 
    // enable the ask_question -button 

He estado leyendo estos artículos sin encontrar una solución adecuada

  1. Official docs about empty: esto es como no es relevante porque se ve de todas las entradas -campos
  2. a thread about disabled -feature in jQuery: esto parece ser relevante
  3. to be able to test jQuery Firefox/terminal: para obtener un entorno de prueba me ayudaría más

Utilizo en este momento el siguiente código. Contiene un error sobre el carácter ;, pero no puedo encontrarlo.

# 1

$(document).ready(function(){ 
    $("#ask_form").validate(){ 
     rules: { 
      username { 
       required: true, 
       minlenghth: 2 
      }, 
      email: { 
       required: true; 
       minlength: 6 
      }, 
      password { 
       required: true,                                  
       minlength: 6 
      } 
     } 
    }); 
} 

# 2 código de Meder

I slighhtly modificado el código del Meder. Deshabilita el botón send permanentemente, por lo que también tiene un error.

$(document).ready(function(){ 
    var inputs = $('input', '#ask_form'), empty = false; 
    // can also use :input but it will grab textarea/select elements and you need to check for those.. 

    inputs.each(function() { 
     if ($(this).val() == '') { 
      empty = true; 
      return; 
     } 
    }); 

    if (empty) { 
     $('.ask_question').attr('disabled', 'disabled'); // or true I believe. 
    } 
}); 

Respuesta

10
var $submit = $("input[type=submit]"); 
if ($("input:empty").length > 0) { 
    $submit.attr("disabled","disabled"); 
} else { 
    $submit.removeAttr("disabled"); 
} 
+2

Solo asegúrese de poner esto en un evento onChange o similar para que se active cada vez que se cambie un campo. –

+0

Su código desactiva los botones. Sin embargo, desactiva los botones también cuando los campos no están vacíos. - ** ¿Cómo se lee este 'de entrada: vacío) .length> 0' en Inglés ** - Mi intento de aplicar la regla dada a la etiqueta' input' que está vacío tal que su longitud es mayor que cero. - Esto no tiene sentido para mí, ya que mi consideración conduce a una contradicción. –

+0

Quité '.length> 0', pero los botones permanecen desactivados. –

0
var inputs = $('input', 'form#foo'), empty = false; 
// can also use :input but it will grab textarea/select elements and you need to check for those.. 

inputs.each(function() { 
    if ($(this).val() == '') { 
     empty = true; 
     return; 
    } 
}); 

if (empty) { 
    $('#el').attr('disabled', 'disabled'); // or true I believe. 
} 
+0

Tu código tiene el mismo problema que el de Jason. Deshabilita el botón 'enviar' de forma permanente. –

-1

Falta el cierre, probar esto por ejemplo # 1:

$(document).ready(function(){ 
    $("#ask_form").validate(){ 
     rules: { 
      username { 
       required: true, 
       minlenghth: 2 
      }, 
      email: { 
       required: true; 
       minlength: 6 
      }, 
      password { 
       required: true,                                  
       minlength: 6 
      } 
     } 
    }); 
}); 
Cuestiones relacionadas