Question

我正在寻找几个小时的答案，但我完全堆积并且脑冻结了。

成功提交后，使用bootstrap模式订阅php表单。一切正常，电子邮件通过，模态显示在一秒或更少的空白页面出现。

我猜是在form.php文件是一个单独的文件之前加载但是有没有办法停止加载空白页？

这是Html代码

＆＃13;

<form action="form.php" method="post">
  <div class="form-group label-floating">
    <input name="email" class="control-label form-control text-center" type="text" placeholder="Enter your email address ...">
    <button type="submit" class="btn btn-primary" data-toggle="modal" data-target="#myModal">Send</button>
  </div>
</form>	


<!-- Sart Modal -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						<i class="material-icons">clear</i>
					</button>
					<h4 class="modal-title">Thank you</h4>
				</div>
				<div class="modal-body">
					<p>Thank you for registering, we have added you to the waiting list!
					</p>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-danger btn-simple" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>
<!--  End Modal -->

＆＃13;

这是php代码

＆＃13;

<?php 
$to = "test@test.com";
$from = "no-reply@test.com";

$headers = "From: " . $from . "\r\n";

$subject = "New Beta Subscription";
$body = "New user interested in beta program: " . $_POST['email'];


if( filter_var($_POST['email'], FILTER_VALIDATE_EMAIL) )
{ 
    if (mail($to, $subject, $body, $headers, "-f " . $from))
    {
        echo "<script type='text/javascript'>
                $(document).ready(function(){
                $('#myModal').modal('show');
                window.stop();
                });
                </script>";
    }
   else
    {
       echo 'There was a problem with your e-mail (' . $_POST['email'] . ')';   
    }
}
else
{
   echo 'There was a problem with your e-mail (' . $_POST['email'] . ')';   
}

＆＃13;

还想更改错误消息以显示过来的模态，生成它只是不确定是否可以从同一个索引文件中调用两个模态？

非常欢迎任何帮助！谢谢，K＆gt;

Answer 1

您尝试实现的目标与您实际编码的内容有所不同。

让我们看看您的HTML表单。您已在提交按钮上附加了Bootstrap的data-toggle和data-target属性。这意味着当您单击该按钮时，它将打开模态并提交表单。因此，用户将简要地看到一个模态，并看到页面重定向到您的PHP文件。（这就是为什么你会看到一个模态出现的原因。）

接下来，让我们看看你的PHP文件。首先，当您将表单从一个页面提交到另一个页面时，后一页面不知道您以前页面中的HTML元素。这意味着您在echo＆＃39; d <script>标记内的代码实际上不应该正常工作，因为它在您以前的页面上查找HTML元素。

现在，关于为什么要获得空白页面的问题？嗯...一切正常，所以你的代码回显了一个<script>标签 - 它没有可视指示器。但就像我刚才说的那样，你在<script>内所拥有的东西不起作用 - 所以没有任何东西出现，没有任何反应。

当您点击按钮时，回顾一下事件的顺序：模式显示，表单提交，表单重定向到另一个页面，而其他页面回显什么都没有。

以下是我认为你想要达到的目标的一个糟糕/快速的解决方案：

将您的HTML文件更改为PHP文件。

从您的按钮中移除data-toggle和data-target属性，以便在您点击按钮时不会打开模式

<form action="form.php" method="post">
    <div class="form-group label-floating">
        <input name="email" class="control-label form-control text-center" type="text" placeholder="Enter your email address ...">
        <button type="submit" class="btn btn-primary">Send</button>
    </div>
</form>

将您的PHP提交页面中的echo＆＃d; script标记移至您的PHP表单页面，并将其包装成如下所示的条件：

<?php if (!empty($_GET['success'])) : ?>
    <script>
        $(document).ready(function(){
            $("#myModal").modal();
        });   
    </script>
<?php endif ?>

在PHP提交页面中删除您的echo＆＃39; d script标记代码行。而是添加一个代码，以便重定向到PHP表单页面。关键部分是，您会在网址末尾添加?success=true。

$email = filter_input(INPUT_POST, 'email', FILTER_VALIDATE_EMAIL); // valid email or null|false

if ($email) { 
    $to = "test@test.com";
    $from = "no-reply@test.com";
    $headers = "From: " . $from . "\r\n";
    $subject = "New Beta Subscription";
    $body = "New user interested in beta program: " . $email;

    if (mail($to, $subject, $body, $headers, "-f " . $from)) {
        header('Location: subscribe.php?success=true'); // replace `subscribe.php` with PHP form page
        exit;
    } 
    echo 'There was a problem with your e-mail (' . $email . ')';   
} else {
   echo 'There was a problem with your e-mail'; // no point in printing $email if it is null   
}

基本上，传递?success=true是为了告诉PHP表单页面打开模态（3）一切顺利。

那应该是它。

更好的方法是学习和使用AJAX。

提交表格后无法删除空白的php页面

1 个答案: