当表单使用$ _POST填充自身时,如何使用表单内的按钮重置PHP表单?

时间:2017-07-24 17:47:07

标签: php html forms

我想在提交旁边添加另一个输入或按钮,以清除表单。 我发现的问题是,因为表单在提交表单后使用$ _POST来保留其值(我想要保留的功能),所以似乎阻止了<input type="reset" value="Reset" name="reset" />之类的工作。

这是代码:

<form method="post" action="<?php echo htmlspecialchars ($_SERVER["PHP_SELF"]);?>">
    Name: <input type="text" name="name" value="<?php echo $name;?>">
    <span class="error">* <?php echo $nameErr;?></span><br>
    E-mail: <input type="text" name="email" value="<?php echo $email;?>">
    <span class="error">* <?php echo $emailErr;?></span><br>
    Website: <input type="text" name="website" value="<?php echo $website;?>">
    <span class="error"><?php echo $websiteErr;?></span><br>
    Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea><br>
    Gender:
    <input type="radio" name="gender" <?php if (isset($gender) && $gender=="female") echo "checked";?> value="female">Female
    <input type="radio" name="gender" <?php if (isset($gender) && $gender=="male") echo "checked";?> value="male">Male
    <span class="error">* <?php echo $genderErr;?></span><br>
    <input type="submit" name="submit" value="Submit">
    <input type="reset" value="Reset" name="reset" />
</form>

5 个答案:

答案 0 :(得分:0)

您可以使用JS重置。

<form is="myForm" method="post" action="<?php echo htmlspecialchars ($_SERVER["PHP_SELF"]);?>">
    Name: <input type="text" name="name" value="<?php echo $name;?>">
    <span class="error">* <?php echo $nameErr;?></span><br>
    E-mail: <input type="text" name="email" value="<?php echo $email;?>">
    <span class="error">* <?php echo $emailErr;?></span><br>
    Website: <input type="text" name="website" value="<?php echo $website;?>">
    <span class="error"><?php echo $websiteErr;?></span><br>
    Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea><br>
    Gender:
    <input type="radio" name="gender" <?php if (isset($gender) && $gender=="female") echo "checked";?> value="female">Female
    <input type="radio" name="gender" <?php if (isset($gender) && $gender=="male") echo "checked";?> value="male">Male
    <span class="error">* <?php echo $genderErr;?></span>
    <br>
    <input type="submit" name="submit" value="Submit">
    <button onclick="document.getElementById("myForm").reset();" value="Clear form" />
</form>

答案 1 :(得分:0)

使用jquery清除值。

添加按钮以重置页面并为其指定ID

<input type="button" id="reset" value="reset">

然后这样做

<script>
$("#reset").click(function(){
$("input").val("");
})
</script>

确保在头部添加jquery库

答案 2 :(得分:0)

点击重置按钮,您可以在php中执行以下操作:

If(isset($_POST['reset'])){
  $_POST = array();
}

答案 3 :(得分:0)

您可以在这里做一些事情,让自己朝着正确的方向前进。如果您在前端使用Javascript(考虑到它2017年我认为这是一个安全的假设),那么您可以简单地使用您正在使用的任何库(阅读:可能是jQuery)和将值设置为空字符串或取消选中它们。

Javascript / jQuery

我非常小心只包含 提交或重置按钮的输入,否则您最终会在底部有两个按钮文本。

另请注意,object是我的jQuery语法,用于向我自己表明此变量是jQuery包装对象。

&#13;
&#13;
$variable
&#13;
$(function() {
  $('[type="reset"]').on('click', function(e) {
    e.preventDefault(); //We don't want the reset function to fire normally.
    var $this = $(this),
      $form = $this.parent('form'),
      $input = $form.find(':input:not(:submit):not(:reset)');
    $input.each((i, item) => {
      var $item = $(item);

      if ($item.is(':checkbox')||$item.is(':radio')) {
        $item.prop('checked', false);
      } else {
        $item.val('');
      }
    });
  });
});
&#13;
&#13;
&#13;

PHP

对于PHP,您想要做的事实上是添加另一个提交按钮,但更改它的值。像这样:

&#13;
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type="email" name="email" value="jbob@app.com" /><br />
  <input type="checkbox" name="something" checked />
  <input type="radio" name="something_else" checked/>
  <input type="submit" />
  <input type="reset" />
</form>
&#13;
&#13;
&#13;

现在,在您的PHP代码中,您可以在顶部执行此操作:

<form method="post" action="<?php echo htmlspecialchars ($_SERVER[" PHP_SELF "]);?>">
  Name: <input type="text" name="name" value="<?php echo $name;?>">
  <span class="error">* <?php echo $nameErr;?></span><br> E-mail: <input type="text" name="email" value="<?php echo $email;?>">
  <span class="error">* <?php echo $emailErr;?></span><br> Website: <input type="text" name="website" value="<?php echo $website;?>">
  <span class="error"><?php echo $websiteErr;?></span><br> Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea><br> Gender:
  <input type="radio" name="gender" <?php if (isset($gender) && $gender=="female" ) echo "checked";?> value="female">Female
  <input type="radio" name="gender" <?php if (isset($gender) && $gender=="male" ) echo "checked";?> value="male">Male
  <span class="error">* <?php echo $genderErr;?></span>
  <br>
  <input type="submit" name="submit" value="Submit">
  <input type="submit" name="submit" value="Reset" />
</form>

答案 4 :(得分:0)

尝试使用Jquery表单重置方法。

将id属性放入表单中的表单标记。

<?php if($_POST['submit']=='Reset') $_POST = array(); 
//you could also use [] to dictate an empty array in more recent versions of PHP.
///rest of code ///

我已将id属性设置为重置按钮,也可以从那里初始化重置功能。在代码下方添加 jquery js并测试重置按钮。

<form id="Myform"  method="post" action="<?php echo htmlspecialchars ($_SERVER["PHP_SELF"]);?>">
            Name: <input type="text" name="name" value="<?php echo $name;?>">
            <span class="error">* <?php echo $nameErr;?></span><br>
            E-mail: <input type="text" name="email" value="<?php echo $email;?>">
            <span class="error">* <?php echo $emailErr;?></span><br>
            Website: <input type="text" name="website" value="<?php echo $website;?>">
            <span class="error"><?php echo $websiteErr;?></span><br>
            Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea><br>
            Gender:
            <input type="radio" name="gender" <?php if (isset($gender) && $gender=="female") echo "checked";?> value="female">Female
            <input type="radio" name="gender" <?php if (isset($gender) && $gender=="male") echo "checked";?> value="male">Male
            <span class="error">* <?php echo $genderErr;?></span>
            <br>
            <input type="submit" name="submit" value="Submit">
            <input id="Reset_btn" value="Reset" name="reset" />
        </form>