发布到 MongoDB 后清除表单输入
Clear form inputs after Posting to MongoDB
我创建了一个表单,将 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>
如果您添加一个适用于大多数现代浏览器的任意时间偏移量。以前只有 Chrome 对此有问题,但我知道 FireFox 现在也有。由于新的 Edge 是基于 Chromium 的,我认为你会 运行 遇到类似的问题而不会抵消事情。
我附上了 Firefox 请求的一些屏幕截图,因为小提琴对于表单提交来说太糟糕了。
function resetBooks(){
setTimeout(function(){ document.getElementById('bookForm').reset();}, 100);
};
我创建了一个表单,将 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>
如果您添加一个适用于大多数现代浏览器的任意时间偏移量。以前只有 Chrome 对此有问题,但我知道 FireFox 现在也有。由于新的 Edge 是基于 Chromium 的,我认为你会 运行 遇到类似的问题而不会抵消事情。
我附上了 Firefox 请求的一些屏幕截图,因为小提琴对于表单提交来说太糟糕了。
function resetBooks(){
setTimeout(function(){ document.getElementById('bookForm').reset();}, 100);
};