如何将表单数据从jQuery提交到PHP?

时间:2015-06-11 12:37:38

标签: php jquery html forms

我尝试使用JQuery验证联系表单,如果一切正常,请将数据提交到php文件以便发送到邮件,但我一直得到“访问控制 - 允许 - 来源& #39 ;.我的页面已打开" exploitrip.com",这是我在浏览器控制台中收到的错误

  

XMLHttpRequest无法加载http://www.exploitrip.com/testing/mailer.php。 No' Access-Control-Allow-Origin'标头出现在请求的资源上。起源' http://exploitrip.com'因此不允许访问。

如果页面已打开" www.expoitrip.com",错误是

  

POST http://www.exploitrip.com/testing/mailer.php 404(未找到)

我尝试添加

<?php header('Access-Control-Allow-Origin: *'); ?>

标签但仍然得到相同的错误。有什么想法吗?

这是HTML表单

<form class="form-horizontal">
     <p id="returnmessage"></p>
     <input type="text" id="inputName" name="inputName" class="form-control max-width" placeholder="Name">
     <input type="text" id="inputPhone" name="inputPhone" class="form-control max-width" placeholder="Phone/Email">
     <!--<input type="text" name="inputEmail" class="form-control" placeholder="My email address is...">-->
     <div class="input-group">
          <select id="inputPackage" name="inputPackage" class="form-control max-width">
               <option value="None">Base Package</option>
               <option value="Swiss-Honeymoon">Swiss Honeymoon</option>
               <option value="Panoramic-Europe">Panoramic Europe</option>
               <option value="Treasures-of-Europe">Treasures of Europe</option>
               <option value="Wonders-of-Europe">Wonders of Europe</option>
               <option value="European-Delights">European Delights</option>
          </select>
     </div>
     <textarea id="inputMessage" name="inputMessage" class="form-control max-width" placeholder="Special requests or custom requirements (Optional)" rows="3"></textarea>
     <div class="text-center">
          <input id="q-submit" type="button"  class="btn btn-lg btn-default btn-query" value="Book Now">
     </div>
</form>

这里是jquery

$(document).ready(function($){

        $("#q-submit").on('click', function() {
            var name = $("#inputName").val();
            var phone = $("#inputPhone").val();
            var package = $("#inputPackage").val();
            var message = $("#inputMessage").val();
            var testEmail = /^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/;
            $("#returnmessage").empty(); // To empty previous error/success message.
            // Checking for blank fields.
            $('.form-horizontal input').on('focus', function(){
                $("#returnmessage").empty();
            })
            if (name == '' || phone == '' || package == '') {
                $("#returnmessage").empty()
                        .append('Please fill all the required fields');
            }
            else if (!phone.match(/^\d{6,10}$/) && !phone.match(/^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/i)) {
                $("#returnmessage").empty()
                    .append('Please Enter a valid Phone number or Email Address');
            }
            else {
                console.log('query in last else');
                // Returns successful data submission message when the entered information is stored in database.
                $.post("../mailer.php", {
                    inputName: name,
                    inputPhone: phone,
                    inputPackage: package,
                    inputMessage: message
                });
            }
        });

});

修改:感谢@jeroen解决了问题,我可以发送邮件,但整件事情仍然没有按预期工作。我没有转发到感谢页面。这里是php

<?php

$myemail = "email@test.com"; //changed

date_default_timezone_set("Asia/Kolkata"); 

$name = $_POST['inputName'];
$phone = $_POST['inputPhone'];
$package = $_POST['inputPackage'];
$message1 = $_POST['inputMessage'];
$time = date("g:i:s a");
$ip = $_SERVER['REMOTE_ADDR'];

$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$subject = "Query at $time from Europe Landing Page";

$message = '<html><body>';
$message .= '<h1>Query Submitted on Singapore Landing Page:</h1>';
$message .= '<table rules="all" style="border-color: #666;width:400px;" cellpadding="10"><tr style="background:#0884d3;color:#ffffff;"><td colspan="2" align="center">Customer Details</td></tr>';
$message .= '<tr><td style="width:200px;">IP</td><td style="width:200px;">' . $ip . '</td></tr>';
$message .= '<tr><td>Name</td><td>' . $name . '</td></tr>';
$message .= '<tr><td>Phone/Email</td><td>' . $phone . '</td></tr>';
$message .= '<tr><td>Package</td><td>' . $package . '</td></tr>';
$message .= '<tr><td>Message</td><td>' . $message1 . '</td></tr>';
$message .= '</table></body></html>';

mail($myemail, $subject, $message, $headers);

header('Location: thank-you.html');
exit();
?>

1 个答案:

答案 0 :(得分:2)

你必须在JavaScript中进行重定向,而不是PHP。

...
else {
  console.log('query in last else');
  // Returns successful data submission message when the entered information is stored in database.
  $.post("../mailer.php", {
      inputName: name,
      inputPhone: phone,
      inputPackage: package,
      inputMessage: message
  }, function() {
      window.location('thankyou.html');
  });
}