表单提交后是否重定向?
Redirect after form submit or not?
在我的个人页面(1 页网站)的底部,我有一个联系表,它向我的数据库发送一条消息,以便我稍后阅读。
问题是,如果我不重定向到任何地方,页面就不会重新加载,这正是我想要的,但正在搜索某些东西并在选项卡中有一个加载图标,最终断开连接并显示"ECONNRESET" 来自 Cloud9 的错误。
如果我确实重定向回 /#contact(到页面,然后向下到联系人部分),然后它会重新加载页面,由于网站的功能,这不是我想要发生的。它有一些动画在发送消息后立即加载,重新加载会取消它们,看起来很糟糕。
如何才能使页面在发送消息后不必重新加载,这意味着我不必重定向到任何地方,但我也不会收到 ECONNRESET 错误?
app.post("/", function (req, res){
// Retrieve form data
var name = req.body.name;
var email = req.body.email;
var subject = req.body.subject;
var message = req.body.message;
var newMessage = {name: name, email: email, subject: subject, message: message};
// Save new message to database
Message.create(newMessage, function (err, sendMessage) {
if (err) {
console.log(err);
} else {
console.log(sendMessage);
}
});
});
如果您不是通过 AJAX 发布表单,那么您应该重定向到呈现视图的 GET
端点。如果您不想重定向,那么至少您需要调用 res.render()
来呈现正确的视图。不重定向的缺点是,如果用户刷新页面,他们可能会收到重新提交表单的提示。
Message.create(newMessage, function(err, sendMessage){
if(err){
console.log(err);
} else {
console.log(sendMessage);
res.render('contact'); //change 'contact' to the name of the view you are rendering
}
});
我进行了一些搜索,然后找到了一种方法来按照我希望的方式进行操作:无需重定向或重新加载页面。
我删除了不必要的错误处理和 console.log,因为我只需要表单将数据发送到我的数据库,以便稍后阅读。
app.post("/", function(req, res){
// Retrieve form data
var name = req.body.name;
var email = req.body.email;
var subject = req.body.subject;
var message = req.body.message;
var newMessage = {name: name, email: email, subject: subject, message: message};
// Save new message to database
Message.create(newMessage);
});
显然我需要一个 Ajax/jQuery 请求,它看起来像这样:
$('form').submit(function(e){
e.preventDefault();
$.ajax({
url:'/',
type:'post',
data:$('form').serialize(),
success:function(){
//whatever you wanna do after the form is successfully submitted
}
});
});
Source 我找到的答案(第一个答案)
在我的个人页面(1 页网站)的底部,我有一个联系表,它向我的数据库发送一条消息,以便我稍后阅读。
问题是,如果我不重定向到任何地方,页面就不会重新加载,这正是我想要的,但正在搜索某些东西并在选项卡中有一个加载图标,最终断开连接并显示"ECONNRESET" 来自 Cloud9 的错误。
如果我确实重定向回 /#contact(到页面,然后向下到联系人部分),然后它会重新加载页面,由于网站的功能,这不是我想要发生的。它有一些动画在发送消息后立即加载,重新加载会取消它们,看起来很糟糕。
如何才能使页面在发送消息后不必重新加载,这意味着我不必重定向到任何地方,但我也不会收到 ECONNRESET 错误?
app.post("/", function (req, res){
// Retrieve form data
var name = req.body.name;
var email = req.body.email;
var subject = req.body.subject;
var message = req.body.message;
var newMessage = {name: name, email: email, subject: subject, message: message};
// Save new message to database
Message.create(newMessage, function (err, sendMessage) {
if (err) {
console.log(err);
} else {
console.log(sendMessage);
}
});
});
如果您不是通过 AJAX 发布表单,那么您应该重定向到呈现视图的 GET
端点。如果您不想重定向,那么至少您需要调用 res.render()
来呈现正确的视图。不重定向的缺点是,如果用户刷新页面,他们可能会收到重新提交表单的提示。
Message.create(newMessage, function(err, sendMessage){
if(err){
console.log(err);
} else {
console.log(sendMessage);
res.render('contact'); //change 'contact' to the name of the view you are rendering
}
});
我进行了一些搜索,然后找到了一种方法来按照我希望的方式进行操作:无需重定向或重新加载页面。
我删除了不必要的错误处理和 console.log,因为我只需要表单将数据发送到我的数据库,以便稍后阅读。
app.post("/", function(req, res){
// Retrieve form data
var name = req.body.name;
var email = req.body.email;
var subject = req.body.subject;
var message = req.body.message;
var newMessage = {name: name, email: email, subject: subject, message: message};
// Save new message to database
Message.create(newMessage);
});
显然我需要一个 Ajax/jQuery 请求,它看起来像这样:
$('form').submit(function(e){
e.preventDefault();
$.ajax({
url:'/',
type:'post',
data:$('form').serialize(),
success:function(){
//whatever you wanna do after the form is successfully submitted
}
});
});
Source 我找到的答案(第一个答案)