为什么在我的猫鼬模式中单击按钮时没有更新喜欢？
[英]Why are likes not being updated on button click in my mongoose schema?
问题描述
I am working on an express app using nodejs and mongoose, i am trying to use js function to update the number of likes on a post in database in my ejs file but it is not working , i have tried onclick() also, bascically anything inside the script tag is not running .
我正在使用 nodejs 和 mongoose 开发一个快速应用程序，我正在尝试使用 js 函数来更新我的 ejs 文件中数据库中帖子的赞数，但它不起作用，我也尝试过 onclick()，基本上任何东西里面的脚本标签没有运行。 Why is this happening , and how can i update the likes of a particular post in database by clicking a button.为什么会发生这种情况，以及如何通过单击按钮更新数据库中特定帖子的喜欢。
Though, i have achieved this likes updation by redirecting to a route in app.js where mongoose function updateOne does it , but i want likes updated without reloadig the page on a button click虽然，我已经通过重定向到 app.js 中的路由来实现此喜欢更新，其中 mongoose 函数 updateOne 执行此操作，但我希望喜欢更新而无需单击按钮重新加载页面
update likes route in app.js更新喜欢 app.js 中的路由
app.get('/liked/:id', (req,res)=>{
Post.updateOne({_id: req.params.id}, {$inc: {likes:1}}, (err,likedpost)=>{
if(err) console.log(err)
else{
res.redirect("/posts/engineering");
}
})
})
show.ejs显示.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
// here i want to add post model of mongoose
var Post = require("../../models/post.js")
<h1> <%= post.title %> </h1>
<h3> <%= post.publish_date %> </h3>
<p> <%= post.content %></p>
<button class="likes">like</button>
</body>
<script>
console.log("like button increment"); // not printing on console
var l = document.querySelector(".likes");
l.addEventListener("click", function(){
console.log("***********");
// here i wanted to update the "likes" field of this post by 1 i.e when user clicks the like button without reloading the page
Post.updateOne({_id: post._id}, {$inc: {likes: 1}});
console.log(post.likes + "people liked" + post.title)
})
</script>
</html>
1 个解决方案
解决方案1
0 已采纳 2020-08-27 07:50:15
If you want like to update without reloading , you need to use AJAX request.如果你想在不重新加载的情况下更新，你需要使用 AJAX 请求。
You don't need to include post.js (var Post = require("../../models/post.js")) in the display page, let the like route be handled by the express server as usual.您不需要在显示页面中包含 post.js (var Post = require("../../models/post.js"))，让像往常一样的路由由快递服务器处理。
In the front end/client code, Shift the script tag inside the body tag, at the end.在前端/客户端代码中，最后将 script 标签移到 body 标签内。
<body>
// here i want to add post model of mongoose
<h1> <%= post.title %> </h1>
<h3> <%= post.publish_date %> </h3>
<p> <%= post.content %></p>
<button class="likes">like</button>
<script>
console.log("like button increment"); // Will print to browser console
var l = document.querySelector(".likes");
l.addEventListener("click", function(){
console.log("***********");
// MAKE AN AJAX REQUEST (POST) HERE TO localhost//liked/:id (pass the appropriate id)
// or replace localhost with actual host/domain
// Check the status returned by the POST request made on the server, if OK, update the
//like value using event listener
})
</script>
</body>
As I have mentioned in the comments, MAKE AN AJAX REQUEST (POST) to the like route localhost//liked/:id (pass the appropriate id) or replace localhost with actual host/domain.正如我在评论中提到的，向类似路由 localhost//liked/:id 发出 AJAX 请求（POST）（传递适当的 id）或将 localhost 替换为实际的主机/域。
Check the status returned by the POST request made on the server, if OK, update the like value using event listener.检查服务器上发出的 POST 请求返回的状态，如果正常，则使用事件侦听器更新类似值。
In the express like route, if database part successful, just send an 200 OK status, don't redirect or anything else.在快递之类的路由中，如果数据库部分成功，只需发送 200 OK 状态，不要重定向或其他任何内容。
In express , change the like route from .get to .post, this is important.在 express 中，将 like 路由从 .get 更改为 .post，这很重要。
Check AJAX examples or tutorial to make an AJAX request.查看 AJAX 示例或教程以发出 AJAX 请求。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.