preventDefault does not work!

Question

preventDefault does not work!

Navigation

#1 by (-3 votes)

0

I have the following form that processes the user's password change request.

<form class="forget-form" id="forget-form" action="datacenter/functions/passwordRecovery.php" method="POST">
    <h3 class="font-green">Esqueceu sua senha?</h3>
    <p> Digite seu e-mail abaixo para receber o procedimento para uma nova senha.</p>
    <div class="form-group" style="margin-bottom:0px">
        <input class="form-control placeholder-no-fix" type="email" autocomplete="off" placeholder="Seu e-mail" name="email" id="email" required/>
    </div>

    <div class="form-actions">
        <button type="button" id="back-btn" class="btn red btn-outline uppercase"><i class="fa fa-chevron-circle-left"></i> voltar</button>
        <button type="submit" class="btn btn-success uppercase pull-right uppercase"><i class="fa fa-paper-plane"></i> enviar</button>
    </div>
</form>

For this I use an asynchronous request so that the user does not leave the screen where it is, it follows my js :

$("#forget-form").submit(function(e){
    e.preventDefault();
    var email = $("#email").val();
    if(isEmail(email) == true){
        $.ajax({
            url: 'datacenter/functions/passwordRecovery.php',
            type: 'POST',
            data: new FormData(this),
            async: true,
            contentType: false,
            processData: false,
            success: function(data){
                console.log(data);
            },
            error: function(error, errorThrown, errorShowcase){
                console.log(data);
            }
        });
    } else {
        console.log('não é um e-mail!');
    }
});

The file passwordRecovery.php only gives echo 'requisição sucedida'; to print in the browser console, just to validate if it really worked, and this is happening, however it happens very fast, it prints to the console, and then redirects me to the file passwordRecovery.php , not preventing action of the form.

javascript jquery

asked by anonymous 03.04.2018 / 16:57

1 answer

single.php does not work How to display objects from a list? [duplicate]

score -3 · Answer 1

preventDefault () should work perfectly, include a return false at the end.

$("#forget-form").submit(function(e){

   e.preventDefault();

   // teu código    

   return false;
});

or if the first option, including return false does not work, consider using e.stopPropagation ()

$("#forget-form").submit(function(e){

  e.preventDefault();
  e.stopPropagation();

  //resto do código

});