正确提交值并在提交表单后以html打印

Question

如何从原始html中的帖子中返回结果？

例如，在我的表单中，我提交了一个电子邮件地址。 提交电子邮件地址后，我想在div中显示该电子邮件并隐藏表格。

我如何使用angularjs和php做到这一点？

简单的HTML表单

<form name="EmailForm" class="form-horizontal" method="post" action="mail_handler.php">
    <div class="form-group form-group-lg">
        <input id="email" type="email" name="email" class="form-control size" ng-model="email.text" placeholder="me@example.com" required>
    </div>
    <div class="form-group">
        <label ng-show="EmailForm.email.$valid"><input ng-model="IAgree" name="tos" required="required" type="checkbox" /> I have read and agree to the Terms of Service</label>
    </div>
    <div class="form-group">
        <button type="submit" name="submit" ng-show="IAgree" class="btn btn-lg btn-primary">
            <span class="glyphicon glyphicon-play-circle" aria-hidden="true"></span>
            Spam me now!
        </button>
    </div>
</form>

和一个简单的PHP

<?php
if(isset($_POST['submit'])){
    $email = $_POST['email'];
    header('Location: index.html');
}
?>

Answer 1

您有两种变体：

1. 您应该将表单的操作更改为“ index.php”，并将表单的所有代码放入index.php中。

2.在另一个变体中，您将使用已完成的所有操作，只需更改header('Location: index.html'); 带有header('Location: index.php/?email=' . urlencode($email));

然后在index.php中：

$email = $_GET['email'];
echo '<div class="email">' . $email . '</div>';

Answer 2

您可以在单个php文件中同时编写html和php。 即form_submit.php创建php文件后，您可以在form_submit文件中编写以下代码。

 <form name="EmailForm" class="form-horizontal" method="post" action="mail_handler.php">
        <div class="form-group form-group-lg">
            <input id="email" type="email" name="email" class="form-control size" ng-model="email.text" placeholder="me@example.com" required>
        </div>
        <div class="form-group">
            <label ng-show="EmailForm.email.$valid"><input ng-model="IAgree" name="tos" required="required" type="checkbox" /> I have read and agree to the Terms of Service</label>
        </div>
        <div class="form-group">
            <button type="submit" name="submit" ng-show="IAgree" class="btn btn-lg btn-primary">
                <span class="glyphicon glyphicon-play-circle" aria-hidden="true"></span>
                Spam me now!
            </button>
        </div>
    </form>

    <?php
    if(isset($_POST['submit']))
    {
    ?>
    <div>
    <?php
        $email = $_POST['email'];
    ?>
    </div>
       <style>
        .form-horizontal{display:none} 
<!-- above statement will hide form after submission of form -->
       </style>
    }
    ?>

提交表单后，您会在特定div的同一页面上看到电子邮件。

Answer 3

如果你有

$email = $_POST['email']; 
header('Location: index.html?email='.urlencode($email));

你可以在index.html中做

window.onload=function() {
  var email = location.search?location.search.split("email=")[1]:"";
  document.getElementById("emailId").innerHTML=decodeURIComponent(email);
}