Boa noite.
Estou tentando fazer uma tela de registro e login para uma aplicação que vai salvar os dados em localStorage
. Para evitar que o usuário se cadastre com dados incompletos desabilitei o botão de submit usando disabled
.
Minha intenção é quando todos os campos forem preenchidos a propriedade disabled
seja removida e o botão possa ser clicado mas não consigo remover o disabled
, tentei de várias maneiras e nada. Creio que a maneira mais fácil seria essa:
var operacao = "A"; //"A"=Adição; "E"=Edição
var indice_selecionado = -1; //Índice do item selecionado na lista
var tbUsuarios;
//aqui o botão submit já está desabilitado
$(document).ready(function() {
$('#buttonSubmitRegister').prop('disabled', true);
});
$(function () {
tbUsuarios = localStorage.getItem("tbUsuarios");// Recupera os dados armazenados
tbUsuarios = JSON.parse(tbUsuarios); // Converte string para objeto
if (tbUsuarios === null) // Caso não haja conteúdo, iniciamos um vetor vazio
tbUsuarios = [];
});
function Adicionar() {
var usuario = JSON.stringify({
Nome: $("#txtNome").val(),
email: $("#txtEmail").val(),
Senha: $("#txtSenha").val()
});
//aqui tentei remover o disabled quando os campos forem preenchidos
if ($("#txtNome").val().length > 1 && $("#txtEmail").val().length > 1 && $("#txtSenha").val().length > 1){
$(document).ready(function() {
$('#buttonSubmitRegister').prop('disabled', false);
});
tbUsuarios.push(usuario);
localStorage.setItem("tbUsuarios", JSON.stringify(tbUsuarios));
alert("Usuário Cadastrado com Sucesso!");
return true;
}
}
<form id="formRegister" nome="formRegister" class="positionFormRegister">
<div class="input-group">
<span class="input-group-addon"></span>
<label for="txtNome"></label>
<input id="txtNome" name="txtNome" type="text" class="form-control" placeholder="Crie seu nome de Usuário" autocomplete="off">
</div>
<div class="input-group">
<span class="input-group-addon"></span>
<label for="txtEmail"></label>
<input id="txtEmail" name="txtEmail" type="text" class="form-control" placeholder="Seu endereço de e-mail" autocomplete="off">
</div>
<div class="input-group">
<span class="input-group-addon"></span>
<label for="txtSenha"></label>
<input id="txtSenha" name="txtSenha" type="password" class="form-control" placeholder="Crie sua senha" autocomplete="off">
</div>
<!--Botão Submit-->
<div>
<input id="buttonSubmitRegister" type="submit" class="btn btn-primary btn-lg positionFormRegister" value="Cadastrar no e-Pro »" onclick="Adicionar()">
</div>
</form>
Alguém tem alguma idéia de como resolver? Obrigado pela ajuda.