无法使用jQuery建立ajax连接,表单自动提交?

时间:2012-05-09 21:22:30

标签: php jquery forms form-submit

我是Jquery的新手,只是面临一个我无法克服的问题。

简单地说,我有一个HTML表单,页面上有一些元素。我想在单击提交按钮时验证表单值,然后使用JQuery将一些表单值插入到数据库中。插入过程成功完成后,我希望自然地提交表单。

我进行了验证工作,并从表单中成功获取所有值,但我无法连接到PHP页面。我有两页。

这是JQuery代码:

        <script type="text/javascript">
        $(document).ready(function() {
            $("#odeme").submit(function() {


                $('#ok').attr('disabled', 'disabled');
                $("#ok").after('<span id="info" style="font-size:8pt;color:green;padding-left:5px;"><img align="absmiddle" src="loading.gif" border="0" /> &nbsp; Ödemeniz Yapılıyor</span>');

                //değişkenler

                var jad = $("#ad").val().length;  
                var jsoyad = $("#soyad").val().length;  
                var jadres = $("#adres").val().length;  
                var jeposta = $("#eposta").val().length;
                var isEposta = $("#eposta").val();
                var epostaReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;  
                var jsehir = $("#sehir").val(); 
                var jtaksit = $("#taksit").val();  
                var jkartisim = $("#kartisim").val().length;  
                var jkartno = $("#kartno").val().length;
                var jkartay = $("#kartay").val();  
                var jkartyil = $("#kartyil").val(); 
                var jkartcvv = $("#kartcvv").val().length;
                var hasError = false;

                // kontrollere başla

                if (jad < 6) {
                    $('#ad').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jsoyad < 2) {
                    $('#soyad').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jadres < 10) {
                    $('#adres').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jeposta < 6) {
                    $('#eposta').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jsehir == 0) {
                    $('#sehir').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jtaksit == 20) {
                    $('#taksit').css('background', '#FF9494');
                    hasError = true;
                    }

                if (jkartisim < 6) {
                    $('#kartisim').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jkartno < 15) {
                    $('#kartno').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jkartay == 0) {
                    $('#kartay').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jkartyil == 0) {
                    $('#kartyil').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (jkartcvv != 3) {
                    $('#kartcvv').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if ($('#sozlesme').is(':checked')) {
                    hasError = false;

                }   else { 
                    $('#sozlesme').css('outline-color', 'red');
                    $('#sozlesme').css('outline-style', 'solid');
                    $('#sozlesme').css('outline-width', 'thin');
                    hasError = true; 
                    }

                if (!epostaReg.test(isEposta)) {
                    $('#eposta').css('border', 'solid 1px red');
                    hasError = true;
                    }

                if (hasError == true) {
                    $("#info").remove();
                    $("#ok").after('<span id="errorSpan" style="color:red;padding-left:5px;">Lütfen formu eksiksiz doldurunuz.</span>');
                    $("#errorSpan").delay(3000).fadeOut(2000);
                    $('#ok').removeAttr("disabled");
                    return false;


                    } else {


                // form verilerini db ye at 

                var form_ad = $("#ad").val();  
                var form_soyad = $("#soyad").val();  
                var form_adres = $("#adres").val();  
                var form_eposta = $("#eposta").val();
                var form_sehir = $("#sehir").val(); 
                var form_taksit = $("#taksit").val(); 
                var form_telno = $("#telno").val(); 
                var form_cinsiyet = $("#cinsiyet").val(); 

                var dataString = 'ad='+ form_ad + 
                                 '&soyad=' + form_soyad + 
                                 '&adres=' + form_adres + 
                                 '&eposta=' + form_eposta + 
                                 '&sehir=' + form_sehir + 
                                 '&taksit=' + form_taksit + 
                                 '&telno=' + form_telno + 
                                 '&cinsiyet=' + form_cinsiyet;

                alert(dataString);

                JQuery.ajax({ 
                    type: "POST", 
                    url: "form.php", 
                    data: dataString, 
                    cache: false,
                    success: function(result){ 


                            if(result == 1) { 
                            alert(result); 

                            return false; } 

                            else {

                            $("#ok").after('<span id="errorSpan" style="color:red;padding-left:5px;">Lütfen formu eksiksiz doldurunuz.</span>');


                            }
                        } 
                    }); 

                }
            });
        });

    </script>

这是form.php的代码

<?php

If (!isset($_POST['ad'])) {
    echo 0;
    }
    else {

$ad = $_POST['ad'];

If ($ad == "asdasd") {
    echo 1;
} else {

echo 0;
}

}
?>

我已经阅读了有关此问题的所有问题,并尝试应用所有解决方案,但我被困:/

1 个答案:

答案 0 :(得分:0)

试试这个:

$(document).ready(function() {
    $("#odeme").submit(function() {

        //validation
        //and
        //ajax

        return false; //this suppresses default form submission behaviour 

    });
});