为什么我的Ajax表单不提交数据?

时间:2018-08-09 18:59:10

标签: javascript html forms

我有我的Ajax表单代码。那是; HTML,JS和PHP,但是我不知道为什么它不起作用。我敢肯定会有一些错误,但是我不知道在哪里以及如何做。下面是我的代码。

这是表单网页:EXAMPLE,但是不知何故表单没有提交(应该是ajax,但是当我单击“提交”按钮时没有任何反应)

我需要对此进行快速修复,并且可以将其用作首选项!

// -----------------------------------------------------
// ----------------    CONTACT FORM    -----------------
// -----------------------------------------------------
jQuery(document).ready(function(){

    reddy_contact_form();
    reddy_anchor();

});


function reddy_contact_form(){

    "use strict";

    jQuery(".contact_form #send_message").on('click', function(){

        var fname       = jQuery(".contact_form #fname").val();
        var email       = jQuery(".contact_form #email").val();
        var bname       = jQuery(".contact_form #bname").val();
        var number      = jQuery(".contact_form #number").val();
        var package     = jQuery(".contact_form #package").val();
        var domain      = jQuery(".contact_form #domain").val();
        var logo        = jQuery(".contact_form #logo").val();
        var img         = jQuery(".contact_form #img").val();
        var rcont       = jQuery(".contact_form #rcont").val();
        var descr       = jQuery(".contact_form #descr").val();
        var success     = jQuery(".contact_form .returnmessage").data('success');

        jQuery(".contact_form .returnmessage").empty(); //To empty previous error/success message.
        //checking for blank fields 
        if(fname===''||email===''||bname===''||number===''||package===''||domain===''||logo===''||img===''||rcont===''||descr===''){

            jQuery('div.empty_notice').slideDown(500).delay(2000).slideUp(500);
        }
        else{
            // Returns successful data submission message when the entered information is stored in database.
            jQuery.post("contact_form/contact.php",{ ajax_fname: fname, ajax_email: email, ajax_bname: bname, ajax_number: number, ajax_package: package, ajax_domain: domain, ajax_logo: logo, ajax_img: img, ajax_rcont: rcont, ajax_descr: descr}, function(data) {

                jQuery(".contact_form .returnmessage").append(data);//Append returned message to message paragraph


                if(jQuery(".contact_form .returnmessage span.contact_error").length){
                    jQuery(".contact_form .returnmessage").slideDown(500).delay(2000).slideUp(500);     
                }else{
                    jQuery(".contact_form .returnmessage").append("<span class='contact_success'>"+ success +"</span>");
                    jQuery(".contact_form .returnmessage").slideDown(500).delay(4000).slideUp(500);
                }

                if(data===""){
                    jQuery("#contact_form")[0].reset();//To reset form fields on success
                }

            });
        }
        return false; 
    });
}

 function reddy_anchor(){

    "use strict";

    jQuery('.anchor_nav').onePageNav();

    var scrollOffset = 70;

    jQuery(".anchor > a").on('click', function(evn){
        evn.preventDefault();
        jQuery('html,body').scrollTo(this.hash, this.hash, {
            gap: { y: -scrollOffset },
            animation:{
                duration: 1500,
                easing: "easeInOutExpo"
            }
        });
        return false;   
    });

} 

在这里,我真的非常感谢您的帮助!

这是表单标签:

<form id="contact_form" action="" method="POST">

这是“提交”按钮标签:

<input type='button' class='btn btn-finish btn-fill btn-primary btn-wd' name='finish' id="send_message" value='Finish' />

0 个答案:

没有答案