0

我创建了一个联系表单，并设置为通过 mail.php 文件发送表单内容。目前，它分别通过 echo 和 die 在新的空白页面上显示成功/错误消息，但我希望在当前页面上弹出某种通知。

我想使用的解决方案是http://www.sandbox.timbenniks.com/projects/jquery-notice/，但该站点上的演示使用了将通知添加到按钮的示例。我需要做的是添加通知来代替 echo 或 die 输出消息。这可能吗？

这是我正在使用的 mail.php 代码...

<?php $name = $_POST['name'];
  $email = $_POST['email'];
  $phone = $_POST['phone'];
  if (isset($_POST['service'])) {
    $service = $_POST['service'];
    // $service is an array of selected values
  }
  $message = $_POST['message'];
  $formcontent=" Message received from wwww.jhnormanandsons.co.uk: \n \n From: $name \n Phone: $phone \n \n Service required: $service \n \n Message: $message";
  $recipient = "jasonbradberry@gmail.com";
  $subject = "You have a new message from $name";
  $mailheader = "From: $email \r\n";
  mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
  echo ("Thank you for your message. We'll be in touch as soon as we can.");
?>

这是表单HTML...

<form id="contact-form" method="post" action="mail.php" name="jh_contact">
  <input type="text" id="name" name="name" placeholder="Name" required />
  <input type="email" id="email" name="email" placeholder="Email" required />
  <input type="tel" id="phone" name="phone" placeholder="Phone" required />
  <textarea id="message" name="message" placeholder="Message" required ></textarea>
  <select name="service">
    <option>Service required</option>
    <option value="MOT">MOT</option>
    <option value="Service / repairs">Service / repairs</option>
    <option value="Cars for sale">Cars for sale</option>
    <option value="Welding">Welding</option>
    <option value="Exhausts">Exhausts</option>
    <option value="Tyres">Tyres</option>
    <option value="Brakes">Brakes</option>
    <option value="Diagnostics">Diagnostics</option>
    <option value="Vehicle checks">Vehicle checks</option>
    <option value="Courtesy car">Courtesy car</option>
    <option value="Advice">Advice</option>
    <option value="Other">Other</option>
  </select>
  <input type="submit" value="Send" id="submit-button" name="submit" />
</form>

谢谢！

4

2 回答 2

0

使用 Jquery post 提交您的表单。并让通知消息显示为 json...

http://api.jquery.com/jQuery.post/

搜索此行以使用 jquery 提交您的表单

“示例：使用 ajax 请求发送表单数据”...

回应..写下这段代码（取自你添加的通知链接）

jQuery.noticeAdd({ text: data , //你的通知消息保持：true });

于 2012-09-14T12:16:45.043 回答
0

我也会禁用 JavaScript 的表单，然后使用 jQuery 将表单发布到页面并以这种方式解析任何正常的成功消息。

<?php
if (isset($_POST['send'])) {
    // process form
    if ($sent === true) {
        $alert_class = 'success';
        $alert_test = 'Your enquiry was sent successfully.';
    }
    else {
        $alert_class = 'error';
        $alert_text = 'There was an error sending your enquiry.';
    }
}
?>
<!DOCTYPE html>
<html>
  <body>
<?php if (isset($alert_text)): ?>
    <div class="alert <?php echo $alert_class; ?>">
      <p><?php echo $alert_text; ?></p>
    </div>
<?php endif; ?>
    <form action="" method="post" id="contact-form">
      <!-- your form -->
    </form>
  </body>
</html>

然后是 jQuery：

(function($) {
    $('#contact-form').submit(function() {
        $.post($(this).attr('action'), $(this).serialize(), function(response) {
            var alert_text = $(response).find('.alert').text();
            alert(alert_text);
        });
        return false;
    });
})(jQuery);

希望有帮助。

于 2012-09-14T12:14:48.140 回答