发布到 MongoDB 后清除表单输入

Question

我创建了一个表单，将 post 数据发送到 MongoDB 数据库。问题是，当我 post 我想要刷新输入字段而不必刷新整个页面时。

当我调用函数 resetBooks() 时，我认为它会先清除表单，然后 post 什么都没有，对吗？

如何获取表单到 post 数据，然后清除输入字段。

<div class="booksInput">
  <h4>Add a book</h4>

  <form id="bookForm" method="post" action="/books" 
      target="hiddenFrame" onsubmit="resetBooks()">
       <input class="form-control" name="title" type="text" placeholder="book title">
       <input class="form-control" name="author" type="text" placeholder="author">
       <input class="form-control" name="description" type="text" placeholder="short description">
       <button class="btn btn-primary" type="submit" value="Add Book">Submit</button>
  </form>

</div>

<script>
  function resetBooks(){
    document.getElementById('bookForm').reset();
    };

  app.post("/", (req, res)=>{
  let myBook = new Book (req.body);
  myBook.save()
  .then(item =>{
    res.send("Book saved to database");
  })
  .catch(err=>{
    res.status(err).send("unable to save to database");
   });
  });

</script>

Answer 1

如果您添加一个适用于大多数现代浏览器的任意时间偏移量。以前只有 Chrome 对此有问题，但我知道 FireFox 现在也有。由于新的 Edge 是基于 Chromium 的，我认为你会运行遇到类似的问题而不会抵消事情。

我附上了 Firefox 请求的一些屏幕截图，因为小提琴对于表单提交来说太糟糕了。

function resetBooks(){
    setTimeout(function(){ document.getElementById('bookForm').reset();}, 100);    
};

发布到 MongoDB 后清除表单输入

Clear form inputs after Posting to MongoDB

javascript

mongodb

forms

reset