Submit does not call function

Question

Submit does not call function

Navigation

#1 by (3 votes)
#2 by (1 votes)
#3 by (1 votes)
#4 by (1 votes)

1

After changing the code, I left it this way but I looked at the browser console and realized that the submit button still does not call the function:

<div class="container">
<div class="spacer">
<div class="row contact">
<div class="col-lg-6 col-sm-6 ">

<form id="form-ajax">
        <input type="text" class="form-control" placeholder="Nome completo:" id="nome">
        <input type="text" class="form-control" placeholder="E-mail:" id="email">
        <input type="text" class="form-control" placeholder="Número para contato:" id="num">
        <textarea rows="6" class="form-control" placeholder="Digite sua mensagem" id="msg"></textarea>
        <input type="button" class="btn btn-success" id="enviar" value="Enviar">
</form>
</div>
</div>
</div>
</div>

<script>
$(document).ready(function(){
    $('#form-ajax').click(function(e){  
    e.preventDefault();
    alert('entrou na função');
    if($('#enviar').val() === 'Enviando...'){
    return(false);
    }

    $('#enviar').val('Enviando...');

    $.ajax({
        url: 'phpmailer.php',
        type: 'post',
        dataType: 'json',
        data: {
            'nome':$('#nome').val(),
            'email':$('#email').val(),
            'num':$('#num').val(),
            'msg':$('#msg').val()
            }
    }).done(function(data){

        alert(data);
        $('#nome').val();
        $('#email').val();
        $('#num').val();
        $('#msg').val();

    });
});
 });
</script>

php html jquery ajax

asked by anonymous 15.06.2016 / 18:00

4 answers

How to break the line when passing the size of the div? How do I get the largest value from an array / vector in python?

score 3 · Answer 1

Pass the jquery script to the head if you do not already have it.

Then put the

$(document).ready(function(){
    //...o seu script atual aqui   
});

and finally pass the e.preventDefault (); just below the

$('#form-ajax').submit(function(e) {
     e.preventDefault();

score 1 · Answer 2

The problem is that the jQuery script runs before the page is fully loaded so it can not assign the event to the form because it does not exist yet. You can solve this in two ways:

1 - You bring the script to the end of the page.

2 - Put every script inside the "ready" function of jQuery to say that the script should only be executed after the page is loaded, like this:

$(document).ready(function(){
    //...o seu script atual aqui
});

score 1 · Answer 3

Enter your script within the function below.

$(document).ready(function(){
    // Aqui
});

This will cause your script to run only after page loading. One tip: Always place your scripts after the content of the pages, before closing the body tag to prevent them from blocking page load for possible errors in the script.

score 1 · Answer 4

<script type="text/javascript">
jQuery(function($) {
    $('#form-ajax').submit(function(e){
           alert('entrou na função');
    if($('#enviar').val() === 'Enviando...'){
           return(false);
    }$('#enviar').val('Enviando...');

    $.ajax({
        url: 'phpmailer.php',
        type: 'post',
        dataType: 'json',
        data: {
            'nome':$('#nome').val(),
            'email':$('#email').val(),
            'num':$('#num').val(),
            'msg':$('#msg').val()
            }
    }).done(function(data){

        alert(data);
        $('#nome').val();
        $('#email').val();
        $('#num').val();
        $('#msg').val();

    });
    e.preventDefault();
     });
 });
</script>

See if this works, do not forget the JQuery library, before the script.