引导表单字段提交后不清除

Bootstrap form fields not clearing after submit

本文关键字:清除 提交 字段 表单      更新时间:2023-09-26

我在我的网站上有一个Bootstrap 3表单。表单发送消息很好,但是当用户提交表单字段不清除之后-我如何解决这个问题?

这是下面的'contact.php'代码。

链接到'contact_me.js' https://jsfiddle.net/wookie/6uag6goe/

<form class="form-horizontal" role="form" method="post" action="contact.php">
<div class="form-group">
    <label for="name" class="control-label">Name</label>
    <input type="text" class="form-control" id="name" name="name" placeholder="First & Last Name" value="<?php echo htmlspecialchars($_POST['name']); ?>">
    <?php echo "<p class='text-danger'>$errName</p>";?>
</div>
<div class="form-group">
    <label for="email" class="control-label">Email</label>
    <input type="email" class="form-control" id="email" name="email" placeholder="example@domain.com" value="<?php echo htmlspecialchars($_POST['email']); ?>">
    <?php echo "<p class='text-danger'>$errEmail</p>";?>
</div>
<div class="form-group">
    <label for="service" class="control-label">Service</label>
    <select class="form-control" id="service" name="service">
        <option>Please select a service:</option>
        <option>service1</option>
        <option>service2</option>
        <option>service3</option>
        <option>service4</option>
        <option>service5</option>
        <option>service6</option>
    </select>
</div>
<div class="form-group">
    <label for="message" class="control-label">Message</label>
    <textarea class="form-control" rows="4" name="message">
        <?php echo htmlspecialchars($_POST[ 'message']);?>
    </textarea>
    <?php echo "<p class='text-danger'>$errMessage</p>";?>
</div>
<div class="form-group">
    <label for="human" class="control-label">2 + 3 = ?</label>
    <input type="text" class="form-control" id="human" name="human" placeholder="Your Answer">
    <?php echo "<p class='text-danger'>$errHuman</p>";?>
</div>
<div class="form-group">
    <input id="submit" name="submit" type="submit" value="Send Message" class="btn btn-lg btn-default btn-block">
</div>
<div class="form-group">
    <?php echo $result; ?>
</div>

修改

$('#contactForm').trigger("reset");

$('#contactForm')[0].reset();

让你的表单有一个id contactForm然后:

$('#contactForm').on('submit', function() {
    $(this).each(function() {
         this.reset();
    });
});

您正在回显发布的数据。您只希望在发布的数据中有错误时这样做。

<input type="email" class="form-control" id="email" name="email" placeholder="example@domain.com" value="<?php echo htmlspecialchars($_POST['email']); ?>">

然而,你正在做你的服务器端错误检测,你只需要做上面的回声,如果有一个错误。假设你存储了一个$isError变量那么你可以把它改成:-

<input type="email" class="form-control" id="email" name="email" placeholder="example@domain.com" value="<?php echo $isError ?htmlspecialchars($_POST['email']) : ""; ?>">