使用Node.js Express猫鼬删除列表项

Question

我试图使用猫鼬从数据库中检索元素后删除它们。 但是我被困在一个我不知道如何“抓住”列表中的特定元素然后如何删除它的地方。

在我的应用程序中，我有一个用户列表和他们的年龄。 这是我的userview.ejs （添加frontend.js后编辑）

 <meta charset="UTF8"> <link href="../public/javascripts/frontend.js"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <link rel="stylesheet" href="/stylesheets/userlist.css"> <link href='//fonts.googleapis.com/css?family=Amatic SC' rel='stylesheet'> <link href='//fonts.googleapis.com/css?family=NTR' rel='stylesheet'> <html> <head> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <title>Userlist</title> <script src="javascripts/frontend.js"></script> <script> </script> </head> <div class="container-fluid"> <div class="row"> <h1><strong>FORM</strong></h1> <hr id="hr2" style="border: 6px solid palevioletred" > <div id="black"> <form class="form-horizontal" method="post" action="/users"> <fieldset> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="textinput">Name : </label> <div class="col-md-4"> <input id="textinput" name="name" placeholder="Enter Username" class="form-control input-md" type="text" value="Name" onfocus="if (this.value=='Name') this.value='';"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="textinput">Age : </label> <div class="col-md-4"> <input id="textinput" name="age" placeholder="Enter Age" class="form-control input-md" type="number"> </div> </div> <!-- Button --> <!-- Button (Double) --> <div class="form-group"> <div class="col-md-8"> <button id="singlebutton" name="button1id" class="btn btn-success">Add User</button> </div> </div> <body> <h1><strong>USERS</strong></h1> <hr id="hr1" style="border: 6px solid #7ec4ec;" > <ul id="list" class="triangle"> <% for(var i=0; i<userlist.length; i++) {%> <li><%= userlist[i].name %> : <%= userlist[i].age %> <a href="#" onclick="delete_element('<%= userlist[i]._id %>')" id="delete">Delete</a> || <a href="#" onclick="update_element()">Update</a></li> <% } %> </ul> </body> </fieldset> </form> </div> </div> </div> </html> 

编辑 ：

这是我的frontend.js

 var $ = require('jquery'); function delete_element (userId) { $.post('delete/user/',userId,function(){ alert('Deleting....'); //For now i have just added an alert. }); } 

这是我的新users.js

 'use strict' var express = require('express'); var router = express.Router(); var User=require('../models/usermodel.js'); var $= require('jquery'); /* GET users listing. */ router.get('/', function(req, res, next) { User.find({},function(err,userModel){ res.render('userview',{userlist:userModel}); }); }); router.post('/', function(req, res, next) { var newUser = new User({ name:req.body.name, age: req.body.age }); console.log(newUser); // save the user newUser.save(function(err) { if (err) throw err; console.log('User created!'); }); }); router.post("delete/user/:id", deleteUser); function deleteUser(req,res){ User.findById(req.params.id).remove().exec(function(err){ if (!err) { console.log('Removed Successfully'); } else { console.log('Error in removing the entry'); } }); } /* function delete_element(id){ $('#delete').on("click",function(){ $(this).parent().remove(); }); User.remove({_id: req.body.id }, function(err) { if (!err) { console.log('Removed Successfully'); } else { console.log('Error in removing the entry'); } }); } */ /*router.post('/', function(req, res, next) { userModel.update( {name: req.params.name}, { $pullAll: {uid: [req.params.deleteUid] } } ) });*/ module.exports = router; 

Answer 1

在删除链接中嵌入用户的_id：

onclick="delete_element('<%= userlist[i]._id %>')"

这将产生：

onclick="delete_element('55510c6cf0e19f6414b30f97')"

并将用户的_id传递给您的删除功能。

编辑

好的，显然，您正在尝试直接从视图（HTML）调用服务器（节点）上定义的函数。 那绝对不是它的工作原理:)

onclick="delete_element()"正在您的浏览器中本地调用一个函数。 控制台（F12）必须大喊error : delete_element is undefined 。

因此，方法如下：

1）创建一个将调用服务器的javascript函数（不在前端应用程序的Node中）。

function delete_element (userId) { // This will be called on click and passed the user's _id
     $.post('delete/user/'+userId) // This calls the server. Todo : add a callback, etc.
}

2）您的节点服务器必须具有将接收呼叫的相应路由：

router.post("delete/user/:id", deleteUser); // This is reached when the client calls post('delete/user/1a2b3c4d'). The id is read with req.params.id

deleteUser = (req,res) => {
     User.findById(req.params.id)
         .remove()
         .exec( error => { // Reply to the client, otherwise the request will hang and timeout.
             if(error) return res.status(500).send(error);
             res.status(200).end()
         })
}

这是第一个问题，请为第二个问题创建一个新问题。