Login and password submit!

Question

I have a simple form to login users with login and password... I’m not getting to give Submit via Jquery, look at the code:

<div id="opcoes2">
<div id="fazerlogin2">
<form name="fazerloginform" id="fazerloginform" action="fazerloginform.php" method="post">
<input id="login" type="text" name="login" value="Login ou email">
<input id="senha" type="password" name="senha" value="Senha">
<span id="esqueceusenha">Esqueceu a senha ?</span>
<input id="entrar" type="submit" value="ENTRAR">
<div id="loginresposta"></div>
</form>
</div>

<script>  
$(document).ready(function() {
        $("#fazerloginform").submit(function() {
            var login = $("#login").val();
            var senha = $("#senha").val();
            $("#entrar").prop('disabled', true);
            $("#loginresposta").html("Logando...");
            $.post('fazerloginform.php', {
                login: login,
                senha: senha
            }, function(resposta) {
                if (resposta != false) {
                    $("#fazerloginform").submit();
                } else {
                    $("#loginresposta").html("Login ou senha incorretos.");
                    $("#entrar").prop('disabled', false);
                }
            }, 'html');
            return false;
        });

 })
</script>  

I’m using jquery version 2.1.1.js, is that it? The error that gives is that it is "Logging..." and for the script, it does not give the Submit!!!

I also wanted to know the best way to login in php and mysql with jquery ?

Answer 1

I was able to change the Submit to a click on the Submit button in the form...:

<script>
$(document).ready(function() {
        $("#entrar").click(function() {
            var login = $("#login").val();
            var senha = $("#senha").val();
            $("#entrar").prop('disabled', true);
            $("#respostalogina").html("Logando...");
            $.post('fazerloginform.php', {
                login: login,
                senha: senha
            }, function(resposta) {
                if (resposta == true) {
                    $("#fazerloginform").submit();
                } else {
                    $("#respostalogina").html("Login ou senha incorretos.");
                    $("#entrar").prop('disabled', false);
                }
            }, 'html');
            return false;
        });

})
</script>  

I’m still waiting for answers. s...

Answer 2

You don’t have to use $("#fazerloginform").submit() if the answer is true.
See if this example helps...

$('form[name="NOMEDOFORM"]').submit( function()
{
    event.preventDefault();
    $('#respostalogina').html( 'logando...' );

    //
    $.ajax({
        url      : 'fazerloginform.php',
        type     : 'POST',
        data     : { login : $("#login").val() , senha : $("#senha").val() },
        success  : function( dataCheck )
        {
            if( dataCheck == false )
            {
                $("#respostalogina").html( 'Login ou senha incorretos.' )
            }
            else
            {
                // login feito
            }
        }
    });
});

Answer 3

I see two problems here. One is that you still have Event Handler active when you want to do Submit in the script.

The Handler Event $("#fazerloginform").submit(function() { is to be called when you do $("#fazerloginform").submit(); within the Success. Once the processing is asynchronous the code goes directly to return false; and the underworld is canceled, as if it had a evento.preventDefault();. So you need to remove Event Handler to make Submit without being intercepted.

Test like this:

$(document).ready(function() {
    $("#fazerloginform").on('submit', function() { // usei .on() aqui, pois uso .off() embaixo
        var self = this;
        var login = $("#login").val();
        var senha = $("#senha").val();
        $("#entrar").prop('disabled', true);
        $("#loginresposta").html("Logando...");
        $.post('fazerloginform.php', {
            login: login,
            senha: senha
        }, function(resposta) {
            if (resposta != false) {
                $(self).off("submit"); // aqui remove o event handler
                $(self).submit(); // agora já pode fazer submit sem chamar este código novamente
            } else {
                $("#loginresposta").html("Login ou senha incorretos.");
                $("#entrar").prop('disabled', false);
            }
        }, 'html');
        return false;
    });

 });