联系表单不解析错误或成功消息

时间:2013-05-16 22:35:13

标签: php javascript jquery html

为项目创建一个小型联系人类型表单,人们可以在该项目中注册对该站点的兴趣,并提供一些有关他们自己的详细信息。所以我决定按照本教程修改它以满足我的需求:http://bit.ly/13zQ7em

我已经修改了PHP和jQuery以便发送电子邮件,现在它已经发生了但是我无法弄清楚为什么jQuery没有触发成功消息,或者当我这样做时显示任何错误输入一些。

据我所知,一切都应该通过确定,但我显然错过了一些东西,我无法弄清楚是什么。所以任何帮助都将不胜感激!

当前的实时表单:http://bit.ly/12yS1eh

HTML:

<div id="interested">
    <div class="content">
        <h2>INTERESTED?</h2>
            <p>If you would like to stay up to date with upcoming content, release dates and chances to win signed prints of the photos, 
            just fill in your details below.</p>
        <div id="thanks"></div>
        <form action="javascript:alert('success!');" id="interestForm">
                <div id="formLeft">
                        <input type="text" id="firstName" name="firstName" value="" placeholder="First name" />
                        <input type="text" id="email" name="email" value="" placeholder="email@email.com" />
                </div>

                <div id="formMiddle">
                        <input type="text" id="lastName" name="lastName" value="" placeholder="Last name" />
                        <input type="text" id="country" name="country" value="" placeholder="Your country" />
                </div>

                <div id="formRight">
                    <input type="submit" name="submit" value="SEND" id="submit" />
                </div>
        </form>
    </div>
</div>

jQuery:

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

var str = $(this).serialize();

   $.ajax({
   type: "POST",
   url: "contact_form/contact.php",
   data: str,
   success: function(msg){

$("#thanks").ajaxComplete(function(event, request, settings){

if(msg == 'OK') // If the email is sent show 'Thank You' message and hide the form
{
result = '<div class="notification_ok">Thanks for registering your interest, we\'ll be in contact soon with more information about the iBook.</div>';
$("#interestForm").hide();
}
else
{
result = msg;
}

$(this).hide();
$(this).html(result).slideDown("slow");

$(this).html(result);

});

}

 });

return false;

});

});

PHP:

    <?php

include 'config.php';
    error_reporting (E_ALL ^ E_NOTICE);
    $post = (!empty($_POST)) ? true : false;

if($post)
    {
        include 'functions.php';
        $firstName = stripslashes($_POST['firstName']);
        $lastName = stripslashes($_POST['lastName']);
        $email = trim($_POST['email']);
        $country = stripslashes($_POST['country']);

        $message = "";
        $message .= "First Name: ";
        $message .= $firstName;
        $message .= "\n";
        $message .= "Last Name: ";
        $message .= $lastName;
        $message .= "\n";
        $message .= "Email: ";
        $message .= $email;
        $message .= "\n";
        $message .= "Country ";
        $message .= $country;


        $error = '';

// Check firstName
if(!$firstName)
    {
        $error .= 'You forgot to enter your first name.<br />';
    }

// Check lastName
if(!$lastName)
    {
        $error .= 'You forgot to enter your last name.<br />';
    }

// Check country
if(!$country)
    {
        $error .= 'You forgot to enter your country.<br />';
    }

// Check email
if(!$email)
    {
        $error .= 'You forgot to enter your e-mail id.<br />';
    }
if($email && !ValidateEmail($email))
    {
        $error .= 'Invalid E-mail id !!!<br />';
    }
if(!$error)
    {
        $subject = 'Hi, '.$firstName. '  ' .$lastName. '  is interested in Ireland - In a new light';
        $mail = mail(WEBMASTER_EMAIL, $subject, $message,
            "From: ".$firstName." ".$lastName." <".$email.">\r\n"
            ."Reply-To: ".$email."\r\n"
            ."X-Mailer: PHP/" . phpversion());
if($mail)
    {
        echo 'OK';
    }
}
else
    {
        echo '<div class="notification_error">'.$error.'</div>';
    }
}
?>

提前感谢您的帮助!

2 个答案:

答案 0 :(得分:1)

您正在附加.ajaxComplete()处理程序错误。

  

从jQuery 1.8开始,只应附加.ajaxComplete()方法   记录。

您可能还想使用jQuery 1.9代替2.0(IE&gt; 9不支持)

你可以删除处理程序(因为你还没有真正使用它)

$(document).ready(function() {
                $("#interestForm").submit(function() {
                    var str = $(this).serialize();
                    var thx = $("#thanks");
                    $.ajax({
                        type: "POST",
                        url: "contact_form/contact.php",
                        data: str,
                        success: function(msg) {

                                if (msg == 'OK') // If the email is sent show 'Thank You' message and hide the form
                                {
                                    result = '<div class="notification_ok">Thanks for registering your interest, we\'ll be in contact soon with more information about the iBook.</div>';
                                    $("#interestForm").hide();
                                }
                                else
                                {
                                    result = msg;
                                }
                                thx.hide();
                                thx.html(result).slideDown("slow");

                                //thx.html(result); <-- you don't need to put it 2 times
                        }
                    });
                    return false;
                });
            });

或者在$(document).ajaxComplete();

中的其他地方使用success: function() {} ..

答案 1 :(得分:0)

你的一堆javascript文件无法加载:

  • JS​​ /使用GreenSock / TweenMax.min.js
  • JS​​ / jquery.superscrollorama.js
  • JS​​ / smoothscroll.js
  • JS​​ / jquery.cycle2.js
  • JS​​ / Modernizr的-1.7.min.js

可能与它有关吗?

也许不是因为它们不是真正的验证脚本......但是将其作为潜在问题进行折扣是值得的。此外,您的一个CSS文件无法加载

  • CSS / mob_global.css