提交后php中的表单未重定向到页面答案

【问题标题】：form in php not redirecting to page after submitting提交后php中的表单未重定向到页面
【发布时间】：2020-05-27 23:33:07
【问题描述】：

我有一个像计算器一样创建的 php 表单，我使用 angular js 在显示器上显示用户输入的值，我设计如下：

<?php

if(isset($_POST['entering'])) {
    header("Location: https://www.google.com");
    exit();
} else {
    $msg="Something Went Wrong. Please try again.";
}
?>

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

  <div class='container'>
    <div class='ct-inner'>

      <!-- Project HTML Below -->
      <div ng-app="" class='calculator'>
        <div class='inner'>

          <div class='innerIn'>
            <div style="height:49px;" class='screen active'>
              <div class='output'> {{name}}</div>

              <div class='screen-layer'></div>
            </div>


            <form method="post" action="">
              <div class='controls'>


                <div style="margin-top:5%;" class="form__group">
                  <input ng-model="name" type="password" class="form__input" id="name" placeholder="Password" required="" maxlength="6" />

                </div>
                <div style="margin-left:35%; margin-top:1%;" class='control-pad operator-pad1'>

                  <input type="button" class='button med oper' name="entering" value="ENTER">
                </div>

              </div>
            </form>
          </div>
          <!-- Inner in End -->
        </div>
      </div>
    </div>
  </div>

这是我的全部代码，当我尝试提交表单输入值时，提交后它不会转到不同的页面，谁能告诉我这里可能出了什么问题，提前谢谢

【问题讨论】：

如果您可以在没有所有 css 的情况下仅发布逻辑（即 php 代码），则更容易理解您在做什么。
您的表单甚至没有提交按钮。如果你在这里有任何额外的 JS 来让这个表单首先提交任何东西，那么你需要向我们展示。
@MortenSickel 我理解，但我认为我的 css 中存在一些问题，导致表单无法提交，这就是为什么发布整个代码
我很确定 POST 永远不会发生，因为没有提交按钮或任何提交表单逻辑。

标签： php html angularjs forms

【解决方案1】：

您的表单没有提交，因为您没有提交按钮，如果您想提交表单，您必须添加带有 type="submit" 的按钮

<button type="submit" value="Submit">Submit</button>

如果你想将表单提交到另一个php脚本，别忘了设置表单action属性

编辑：

添加我的按钮并var_dump页面顶部$_POST变量的内容，提交后可能为空。

【讨论】：

这不是我的问题，我给的按钮不起作用

【解决方案2】：

请改用<input type="submit"。

<?php
if(isset($_POST['entering'])) {
    header("Location: https://www.google.com");
    exit();
}
?>
<html>
    <head><title>the title</title></head>
    <body>
        <form method="POST">
            <input type="submit" name="entering" value="Go to google.com">
        </form>
    </body>
</html>

【讨论】：

已更改，仍未提交
将输入包装在一个表单标签中

【解决方案3】：

来自文档：

由于表单在客户端 AngularJS 应用程序中的作用不同于传统的往返应用程序，因此浏览器最好不要将表单提交转换为将数据发送到服务器的完整页面重新加载。相反，应该触发一些 javascript 逻辑来以特定于应用程序的方式处理表单提交。

因此，AngularJS 会阻止默认操作（向服务器提交表单），除非<form> 元素具有指定的操作属性。

您可以使用以下两种方式之一来指定提交表单时应调用的javascript方法：

ngSubmit 表单元素上的指令

ngClick 指令在第一个按钮或提交类型的输入字段 (input[type=submit])

有关详细信息，请参阅

AngularJS <form> Directive API Reference - Submitting a form and preventing the default action

【讨论】：

【解决方案4】：

我已经编辑了您现在似乎可以使用的代码，并将其重定向到 Google.com。

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

    header("Location: https://www.google.com");
    exit();
} else {
    $msg="Something Went Wrong. Please try again.";
}
?>

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

  <div class='container'>
    <div class='ct-inner'>

      <!-- Project HTML Below -->
      <div ng-app="" class='calculator'>
        <div class='inner'>

          <div class='innerIn'>
            <div style="height:49px;" class='screen active'>
              <div class='output'> {{name}}</div>

              <div class='screen-layer'></div>
            </div>


            <form action="" method="post">
              <div class='controls'>


                <div style="margin-top:5%;" class="form__group">
                  <input ng-model="name" type="password" class="form__input" id="password" name = "password" placeholder="Password" required="" maxlength="6" />

                </div>
                <div style="margin-left:35%; margin-top:1%;" class='control-pad operator-pad1'>

                  <input type="submit" class='button med oper' name="entering" value="ENTER">
                </div>

              </div>
            </form>
          </div>
          <!-- Inner in End -->
        </div>
      </div>
    </div>
  </div>

【讨论】：