0

Hola que tal tengo una consulta tengo 2 input y un select y un boton claro. Lo que de seo es cuando se llenen los 3 campos(input y select) se habilite el boton sino que se mantenga desabilitado. Les agradeceria su ayuda! Gracias de antemano.

Pdt: Estoy trabajando con Materialize.css

Estoy intentando algo como esto:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Login</title>
        <link rel="stylesheet" href="css/materialize.min.css">
        <link rel="stylesheet" href="css/style.css">
    </head>
    <body> 
      <div class="materialContainer">
        <div  style="background-color:rgba(208, 208, 208, 0.00);"></div>
          <div class="card">

            <h1 class="title" >&nbsp;&nbsp;&nbsp;
              <img src="img/logo_sesion.png" width="90" style="position:relative; right: 35px; bottom: 30px"/>
            </h1>

            <form name="Login">

              <div class="card-content">
                  <div class="row" style="margin: auto">
                    <div class="input-field col s12">
                        <input id="user_name" type="text" class="validate">
                        <label for="user_name" class="active">Usuario (Email)</label>
                    </div>
                  </div>
                  <div class="row" style="margin: auto">
                    <div class="input-field col s12">
                      <input id="password" type="text" class="validate">
                      <label for="password" class="active">Contraseña</label>
                    </div>
                 </div>
                 <div class="row" style="margin: auto">
                    <div class="input-field col s12">
                      <select id="dominio">
                        <option value="" disabled selected>Seleccionar</option>
                        <option value="1">Option 1</option>
                        <option value="2">Option 2</option>
                        <option value="3">Option 3</option>
                      </select>
                      <label>Dominio</label>
                    </div>
                 </div>
                 <div class="col s10 offset-s2 center-align">
                   <a id="login_ing" class="waves-effect grey darken-3 btn disabled" type="submit" name="action">Ingresar</a>
                 </div>
             </div>                 
        </form> 
          </div>   
      </div>

        <script src="js/jquery-3.2.1.js"></script>
        <script src="js/materialize.min.js"></script>

        <script>
          $(document).ready(function() {
              $('select').material_select();
          });

        $(document).ready(function() {
            if($("#user_name").val() === "" && $("#password").val() === "" && $("#dominio").val() === "") {
                $("#login_ing").attr("disabled", true);
            }else{
                $("#login_ing").attr("disabled", false); 
            }
  });

        </script>
    </body>
</html>

Pero no me sale algun consejo?

2 respuestas 2

1
$('#boton').attr("disabled", true);

Con ese código debería funcionar para deshabilitarlo. Si quieres habilitarlo de nuevo prueba con:

$('#boton').attr("disabled", false);
3
  • Hola Mikel estava intentando algo como esto: $(document).ready(function() { if($("#user_name").val() === "" && $("#password").val() === "" && $("#dominio").val() === "") { $("#login_ing").attr("disabled", true); }else{ $("#login_ing").attr("disabled", false); } }); Pero no me sale algun consejo? el 5 nov. 2017 a las 20:39
  • Edita la pregunta e inserta ese código para poder verlo mejor si es posible. el 5 nov. 2017 a las 20:40
  • A lo mejor añade todo el código para ver todo más fácilmente. el 5 nov. 2017 a las 20:44
0

Encontré una solución a lo que pregunte pero no esta del todo terminada, verán me falta el select y no se como hacer ello si supieran seria genial que lo compartieran, Saludos!

$(document).ready(function() {
    $('a[type="submit"]').attr('disabled','disabled');
    $('input[type="text"]').keypress(function(){
      if($("#user_name").val() != '' && $("#password").val() != '') {
        $('a[type="submit"]').removeAttr('disabled');
      }
    });
});

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.