使用 Node.js Express Mongoose 删除列表项

Posted

技术标签:

【中文标题】使用 Node.js Express Mongoose 删除列表项【英文标题】:Delete list items using Node.js Express Mongoose 【发布时间】:2017-08-04 14:48:56 【问题描述】:

我正在尝试在使用 mongoose 从数据库中检索元素后删除它们。但是,我被困在我不知道如何“抓取”列表中的一个特定元素然后如何删除它的部分。

在我的应用中,我有一个用户列表和他们的年龄。 这是我的 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;

【问题讨论】:

【参考方案1】:

将用户的 _id 嵌入到您的删除链接中:

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

这将产生:

onclick="delete_element('55510c6cf0e19f6414b30f97')"

并将用户的 _id 传递给您的删除函数。

编辑

好吧,显然,您正在尝试直接从您的视图 (HTML) 调用在服务器 (Node) 上定义的函数。 这绝对不是它的工作原理:)

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) 你的 Node 服务器必须有相应的路由来接收调用:

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()
         )

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

【讨论】:

还是不行。 delete_element() 函数是否正确? 是的,Mongoose 的调用似乎是正确的。你的delete_element 函数是什么样的(前端的,不是 Node 中的)? 没有这样的。 或.......您是否尝试直接从您的视图(HTML)调用服务器(节点)上定义的函数,中间没有任何其他操作? O_o 我会说是的。如果这很荒谬,请指导我。我对这个领域比较陌生。

以上是关于使用 Node.js Express Mongoose 删除列表项的主要内容,如果未能解决你的问题,请参考以下文章

使用 Node.js 和 Express 发布时如何访问请求正文?

使用 node.js 和 express 的 JQuery Ajax 发布请求

Socket.io 使用 node.js,根本没有 express?

node.js 的猫鼬外键问题

node.js + express.js:使用 mongodb/mongoose 处理会话

如何使用 node.js/express 中止请求?