2

我正在处理的时事通讯订阅表格可以在此链接的页脚中找到。

目前，当提交表单时，错误/成功消息会显示在新页面上。

相反，我希望错误/成功消息直接显示在页脚的表单下方。

IE。如果用户输入电子邮件地址 name@website.com，则文本“Success”应显示在输入字段下方而不是新页面上。

帮助将不胜感激！

这是我现在得到的：

在标题中

<script>
function submitEmail() {

    var email = $('#emailText').val();

    jQuery.post('/common/php/send_news.php', {
        email: email
    },function(data){
        $('#submissionResponse').html(data);
    },html);

}
</script>

形式

<form method="post">
        <fieldset>
        <h3></h3>
        <input type="text" name="email" maxlength="80" class="input" value="enter your email address..." onfocus="this.className=('input_active')" onblur="this.className=('input')" onclick="this.value='';" />
        <input type="button" name="submit"  value="" class="subscribe_btn" onmouseover="this.className=('subscribe_btn_over')" onmouseout="this.className=('subscribe_btn')" onclick="submitEmail();" />
        <small>*we will not share your email address</small><span class="clear"></span>
        </fieldset>
      </form>
      <div id="submissionResponse"></div>

send_news.php

<?php
if(isset($_POST['email'])) {

    // EDIT THE 2 LINES BELOW AS REQUIRED
    $email_to = "test@emailtest.com";
    $email_subject = "Newsletter Subscription";


    function died($error) {
        // your error code can go here
        echo "There was an error with your submission";
        echo $error."<br /><br />";
        die();
    }

    // validation expected data exists
    if(
        !isset($_POST['email'])) {
        died('There was an error with your submission');       
    }

    $email_from = $_POST['email']; // 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 />';
  }

  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 .= "Email: ".clean_string($email_from)."\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);  
?>

<!-- include your own success html here -->

Thanks for signup up for the Newsletter!

<?php
}
?>
4

2 回答 2

2

如果您希望这样做，您需要使用 AJAX POST 提交之类的东西，而不是普通的表单 POST 提交。然后，您可以将响应文本放在您希望指示错误或成功条件的任何位置。

于 2011-07-14T03:24:04.613 回答
2

我要做的是设置一个显示成功或失败的简单页面，然后使用 Ajax 调用将信息从表单传递到该页面——您可以使用 jQuery 来实现这个目标。

将此添加到 javascript 文件或脚本标记中的标题中：

function submitEmail() {

    var email = $('#emailText').val();

    jQuery.post('/submission.php', {
        email: email
    },function(data){
        $('#submissionResponse').html(data);
    },html);

}

然后更改表单，使提交按钮如下所示：

<input type="button" name="submit" value="Submit" onclick="submitEmail();" />

然后在表单下方添加一个 id 为“submissionResponse”的 div，如下所示：

<div id="submissionResponse"></div>

这样，您将能够像更改页面时一样处理帖子，但您将自动提交数据并获取响应。

另一个编辑：

当我这样做时，我不妨给出另一种方法来做类似的事情。您可以不使用 Ajax，而是完全按照您现在所做的那样做，但是指示表单重新加载当前页面 ( action="<?php echo $_SERVER['PHP_SELF']; ?>")，然后在此页面的顶部添加

if(isset($_POST['email'])){
    include('submission.php');
}

在表格下方有：

<div id="formStatus"><?php echo isset($formStatusResponse) ? $formStatusResponse : null; ?></div>

实现同一目标的两种方法。使用 Ajax 更快，因为它只需要最终用户加载单行文本，而第二种方法需要完全重新加载整个页面。

于 2011-07-14T03:26:15.410 回答