在我的联系表格中使用ajax

时间:2015-11-27 11:05:09

标签: javascript php ajax html5 forms

错误的屏幕截图

enter image description here

嘿,我正在尝试为我的联系页面建立联系表单。当"提交表格"时,我似乎无法通过表格向我发送表格中输入的电子邮件。按下按钮。

...这是我的HTML

$("form.send_form_email").submit(function(e) { 
    e.preventDefault();
    var form = $(this),
    validationErrors = false;

$('.form-error-msg').remove();

form.find("input[type='email'], input[required]").each(function(index){
        var inputValue = $(this).val(),
            inputRequired = $(this).attr('required'),
            inputType = $(this).attr('type');

$(this).removeClass('form-error');
        if(inputRequired && inputValue == '') {

$(this).after('<div class="form-error-msg">Please fill out this field.</div>');

$(this).addClass('form-error');
            validationErrors = true;
        } else if(inputType == 'email' && !isValidEmail(inputValue)) {

$(this).after('<div class="form-error-msg">Please enter an email address.</div>');
            $(this).addClass('form-error');
            validationErrors = true;
        }
    });

if (!validationErrors) {
        form.find('button:submit, input:submit').html('Sending...');
        form.find('.ajax-response').empty();
        $.post(form.attr('action'), form.serialize(),
            function(data) {
                if (data.bFormSent) {
                    form.find('.ajax-response').empty().html(data.aResults[0]);
                    form.find('button:submit, input:submit').html('Submit Form');
                    form.find('#email, #first_name, #last_name #comments').val('');
                } else {
                    form.find('.ajax-response').empty().wrapInner('<div class="form-error-msg"></div>');
                    form.find('.ajax-response div').html(data.aErrors[0]);
                    form.find('button:submit, input:submit').html('Try Again');
                }
            }, 'json');
    }
});

...这是我的javascript

<?php

if(isset($_POST['email'])) {

// EDIT THE 2 LINES BELOW AS REQUIRED

$email_to = "myemail";

$email_subject = "this subject";

function died($error) {

    // your error code can go here

    echo "We are very sorry, but there were error(s) found with the form you submitted. ";

    echo "These errors appear below.<br /><br />";

    echo $error."<br /><br />";

    echo "Please go back and fix these errors.<br /><br />";

    die();

}

// validation expected data exists

if(!isset($_POST['first_name' ]) ||

    !isset($_POST['last_name']) ||

    !isset($_POST['email']) ||

    !isset($_POST['telephone']) ||

    !isset($_POST['comments'])) {

    died('We are sorry, but there appears to be a problem with the form you submitted.');       

}

$first_name = $_POST['first_name']; // required

$last_name = $_POST['last_name']; // required

$email_from = $_POST['email']; // required

$telephone = $_POST['telephone']; // not required

$comments = $_POST['comments']; // required

 $error_message = "";

$email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';

if(!preg_match($email_exp, $email_from)) {

$error_message .= 'The Email Address you entered does not appear to be   valid.<br />';
}
$string_exp = "/^[A-Za-z .'-]+$/";
if(!preg_match($string_exp,$first_name)) {

$error_message .= 'The First Name you entered does not appear to be valid.<br />';
}

if(!preg_match($string_exp,$last_name)) {

$error_message .= 'The Last Name you entered does not appear to be valid.<br />';
}

if(strlen($comments) < 2) {

$error_message .= 'The Comments you entered do not appear to be valid.<br />';
}

if(strlen($error_message) > 0) { 

died($error_message);
} 

$email_message = "Form details below.\n\n";

function clean_string($string) {

  $bad = array("content-type","bcc:","to:","cc:","href");

  return str_replace($bad,"",$string);
}

$email_message .= "First Name: ".clean_string($first_name)."\n";

$email_message .= "Last Name: ".clean_string($last_name)."\n";

$email_message .= "Email: ".clean_string($email_from)."\n";

$email_message .= "Telephone: ".clean_string($telephone)."\n";

$email_message .= "Comments: ".clean_string($comments)."\n";

// create email headers

$headers = 'From: '.$email_from."\r\n".

'Reply-To: '.$email_from."\r\n" .

'X-Mailer: PHP/' . phpversion();

@mail($email_to, $email_subject, $email_message, $headers);  

?>

...这是我的PHP

$EmailFrom = "from@gmail.com"

$EmailTo = "to@domain.com"

$Subject = "The subject of your email"

$Body = "What do you want your email to say"

$SMTPServer = "smtp.gmail.com"

$SMTPClient = New-Object Net.Mail.SmtpClient($SmtpServer, 587)

$SMTPClient.EnableSsl = $true

$SMTPClient.Credentials = New-Object System.Net.NetworkCredential("gmail_username", "password");

$SMTPClient.Send($EmailFrom, $EmailTo, $Subject, $Body)

1 个答案:

答案 0 :(得分:1)

啊,伙计!刚才我看到了你的截图。您使用服务器执行PHP文件!您需要使用Apache / PHP Server运行它。

<强> How to run php files on my computer

  

您必须运行Web服务器(例如Apache)并浏览到您的   localhost,大多数可能在80端口。

     

你真正应该做的是安装一个多功能的软件包   XAMPP,它捆绑了Apache,MySQL PHP和Perl(如果你是这样的话)   倾斜的)以及一些与Apache和MySQL一起使用的其他工具    - 加上它的跨平台(这就是'XAMPP'中的'X'代表的含义)。

     

一旦你安装了XAMPP(并且有一个安装程序,所以它不应该   hard)打开XAMPP的控制面板,然后单击“开始”   Apache旁边的按钮 - 请注意在需要的应用程序上   数据库,你还需要启动MySQL(你将能够   通过phpMyAdmin与它进行交互。一旦你启动了Apache,你就可以了   可以浏览http://localhost

     

同样,无论你是否选择XAMPP(我愿意   推荐),你应该只需要启动Apache。

另一个

  

简而言之:

     
      
  1. 安装WAMP

  2.   
  3. 将此文件放入C:\ wamp \ www \ ProjectName \ filename.php

  4.   
  5. 转到浏览器:http://localhost/ProjectName/filename.php

  6.