1

Bom, não sei se meu titulo está referente ao oque estou pedindo, mas tenho um formulário com um botão de Entrar.

<button id="btn_entrar" data-loading-text="carregando..." autocomplete="off" class="btn btn-primary btn-cons m-t-10" type="submit" onclick="return Get_Acesso();">Entrar</button>

E quando eu inserir login e senha quero que esse botão fique "carregando..." aí pesquisei na internet e vi esse caso:

  $('button[data-loading-text]').on('click', function () {
    var btn = $(this)
    btn.button('loading')
    setInterval(function () {
        btn.button('reset')
    }, 3000)
});  

Porém não quero um tempo definido ( no caso 3 segundos ) quero que ele de o reset depois da minha função GetAcesso() der algum retorno seja ele falso ou true. Alguém sabe uma solução?

function Get_Acesso(){
    usuario = document.getElementById('txt_user_name').value;
    senha = document.getElementById('txt_password').value;

    LoginDTO.Usuario = usuario;
    LoginDTO.Senha = senha;

    var DTO = { 'LoginDTO': LoginDTO};
    //acessar login
    $.ajax({
        type: "POST",
        url: "default.aspx/Acesso_Login",
        data: JSON.stringify(DTO),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        beforeSend: function () { 
            $('#btn_entrar').html('Carregando...');
        },          
        success: function (msg) {
            $('#btn_entrar').html('Entrar');
            try {
                //tratamentos de msg
                if (msg.d == "err") {
                    document.getElementById('spn_retorno').innerHTML = "Erro inesperado no momento do acesso.";
                    return false;
                    //Não encontrou nenhum registro
                } else if (msg.d == "not") {
                    document.getElementById('spn_retorno').innerHTML = "Usuário / senha inválido.";
                    return false;
                    //Campos vazios
        }

Código simples de acesso, mas quero que quando de o retorno de error ele volte com o botão padrão de "Entrar".

6
  • Gabriel, coloque o seu código referente onde usa a função GetAcesso
    – KaduAmaral
    Commented 19/01/2016 às 11:49
  • Quando você aperta para entrar dá algum erro no Inspect Element do Chrome de script ? Veja lá. Commented 19/01/2016 às 12:16
  • Nenhum erro aparece
    – Voltz
    Commented 19/01/2016 às 12:17
  • Ahh, apaga essa função. $('button[data-loading-text]')... Commented 19/01/2016 às 12:18
  • funcionou, na verdade era no proprio botão eu tirei isso do html e funcionou "data-loading-text="carregando..."". Valeu!
    – Voltz
    Commented 19/01/2016 às 12:21

2 Respostas 2

2

Antes do success: function (msg) poderá colocar um:

beforeSend: function(){ // Ou seja, 'antes de enviar'
    $('#btn_entrar').html('Carregando...');
},
success: function(msg){
    $('#btn_entrar').html('Entrar'); // Volta o botão no seu valor normal
}
4
  • Ficaria assim ? contentType: "application/json; charset=utf-8", dataType: "json", beforeSend: function () { $('#btn_entrar').html('Carregando...'); }, success: function (msg) { $('#btn_entrar').html('Entrar'); try {
    – Voltz
    Commented 19/01/2016 às 12:07
  • Isso mesmo. O que muda é a adição do beforeSend e a adição do Reset do botão dentro da função success. Commented 19/01/2016 às 12:09
  • Estranho coloquei o código e ele não muda...
    – Voltz
    Commented 19/01/2016 às 12:11
  • Atualiza seu POST com o novo código. Commented 19/01/2016 às 12:13
1

Uma opção seria fazer a requisição via ajax, assim você chamaria a função de resetar depois da resposta. Não sabendo como é essa função GetAcesso, imagino que a melhor forma de fazer ela seria assim:

$.ajax({
    //Os seus parametros para verificar o usuario e senha
        data: parametros,
    //sera usado o método get
        method : 'get',
    //a url que queremos requisitar
        url    : 'requisitada.html',
    //o tipo da requisição
        dataType: 'html',
    //aqui é onde pegamos o retono da requisição
        success : function(retorno){
    //Aqui você coloca a função de resetar o texto do botão.
            ResetaTexto();
        }
    }); 

Foi somente um exemplo para ter pelo menos uma base. Acredito que seja a melhor forma.

3
  • Vou tentar, inclui o método do Acesso caso ajude, obrigado pela resposta
    – Voltz
    Commented 19/01/2016 às 11:58
  • Leonardo, como ficaria esse método ResetaTexto() ?
    – Voltz
    Commented 19/01/2016 às 12:02
  • O exemplo que o Zoom cedeu é uma ótima opção de como esse método poderia ser! Commented 19/01/2016 às 12:08

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .