Ajax不止一次发送表单

Question

Why my form is getting submited not just once? Sometimes, it send it about 2-3-4-5 times, and i get 2-3-4-5 email, that a new message is sended from the site.

Why doesnt the button disabled works here? What sould i do?

$("#AjanlatKeresBtn").click(function() // This opens the modal only
{
    $('#AjanlatResult').hide();
    $("#AjanlatModal").modal("show");
    $('#AjanlatForm').on('submit', function(e)
    {
        $('#kerdesButton').prop('disabled', true);
        e.preventDefault();
        var FormErros = [];
        var AjanlatNev = $('#AjanlatNev').val();
        var AjanlatEmail = $('#AjanlatEmail').val();
        var AjanlatTel = $('#AjanlatTel').val();
        var AjanlatCim = $('#AjanlatCim').val();
        var AjanlatMennyiseg = $('#AjanlatMennyiseg').val();
        var AjanlatUzenet = $('#AjanlatUzenet').val();
        var AjanlatTermekID = $('#AjanlatTermekID').val();
        if($.trim(AjanlatNev) == "") { FormErros.push("Nem adta meg a nevét."); }
        if($.trim(AjanlatEmail) == "") { FormErros.push("Nem adta meg az e-mail címét."); }
        if(AjanlatEmail != ""){if(validate_Email(AjanlatEmail) == false){FormErros.push("Elképzelhető, hogy hibásan adta meg az e-mail címét.");}}
        if($.trim(AjanlatTel) == "") { FormErros.push("Nem adta meg a telefonszámát."); }
        if($.trim(AjanlatUzenet) == "") { FormErros.push("Nem írt semmilyen kérdést vagy üzenetet."); }
        if($.trim(AjanlatTermekID) == "") { FormErros.push("Hiányzik a termék ID."); }
        if(AjanlatTermekID != ""){if(!$.isNumeric(AjanlatTermekID)){FormErros.push("A termék ID nem szám típusú.");}}
        if($.trim(AjanlatCim) == "") { FormErros.push("Nem adta meg a szállítási címet."); }
        if($.trim(AjanlatMennyiseg) == "") { FormErros.push("Nem adta meg a termék(ek) mennyiségét."); }
        if(FormErros.length == 0 )
        {
            $.ajax({
                type: 'POST',
                cache: false,
                data: $('#AjanlatForm').serialize(),
                url: 'files/uj-ajanlatkeres.php',
                success: function(data)
                {
                    $('#kerdesButton').hide();
                    $('#AjanlatForm')[0].reset();
                    location.href = "<?php echo $host; ?>/uzenet/uj-ajanlatkeres";
                }
            });
        }
        else
        {
            $('#kerdesButton').prop('disabled', false);
            $('#AjanlatResult').fadeIn( "slow" ).html('<div class="javascript_rror_div">'+(FormErros.join('<br/>'))+'</div>');
        }
    });
    e.stopPropagation();
});

Answer 1

Move submit handler out of the click event handler, that is how click handler for modal should looks like, and i refactored your submit handler for you:

$("#AjanlatKeresBtn").click(function(){
  $('#AjanlatResult').hide();
  $("#AjanlatModal").modal("show");
  e.stopPropagation();
});


$('#AjanlatForm').on('submit', function(e)
{
    $('#kerdesButton').prop('disabled', true);
    e.preventDefault();
    var field, 
        FormErros = [],
        fields = { Nev: "Nem adta meg a nevét.", 
                   Tel: "Nem adta meg a telefonszámát.",
                   Uzenet: "Nem írt semmilyen kérdést vagy üzenetet.", 
                   TermekID: "Hiányzik a termék ID.",
                   Cim: "Nem adta meg a szállítási címet.", 
                   Mennyiseg: "Nem adta meg a termék(ek) mennyiségét.",
                   Email: "Nem adta meg az e-mail címét."
                 };
    Object.keys(fields).forEach(function(key){
        field = $("#Ajanlat"+key).val();
        if($.trim(field) == "") { FormErros.push(field[key]); }
        else{
            if(key == 'Email' && !validate_Email(field)){FormErros.push("Elképzelhető, hogy hibásan adta meg az e-mail címét.");}
            if(key == 'TermekID' && !$.isNumeric(field)){FormErros.push("A termék ID nem szám típusú.");}
        }
    });
    if(FormErros.length == 0 )
    {
        $.ajax({
            type: 'POST',
            cache: false,
            data: $('#AjanlatForm').serialize(),
            url: 'files/uj-ajanlatkeres.php',
            success: function(data)
            {
                $('#kerdesButton').hide();
                $('#AjanlatForm')[0].reset();
                location.href = "<?php echo $host; ?>/uzenet/uj-ajanlatkeres";
            }
        });
    }
    else
    {
        $('#kerdesButton').prop('disabled', false);
        $('#AjanlatResult').fadeIn( "slow" ).html('<div class="javascript_rror_div">'+(FormErros.join('<br/>'))+'</div>');
    }
});