EJS MongoDb 拉取数组中的项目

Posted 2023-03-08

【中文标题】EJS MongoDb 拉取数组中的项目

【英文标题】：EJS MongoDb Pull items in array

【发布时间】：2021-12-06 14:17:51

【问题描述】：

小总结：

我在 Node / Express / MongoDB / EJS 中有一个项目。

我正在设置代码来编辑数组，我的后端代码工作正常（用 PostMan 测试） 但是，我无法让我的前端工作。

当我点击 a.deleteskill 时，无论是在控制台还是其他地方都没有反应。

型号：

skills: 
  type: [
    
      skill: String,
      level: String,
    ,
  ],
,

路线：

router.put('/deleteskills/:id/:skill', userController.deleteskill);

控制器：

module.exports.deleteskill = async (req, res) => 
  const skill = req.body;
  try 
    
    await Model.findOneAndUpdate(
       _id: req.params.id ,
      
        $pull :  
          skills: 
            skill: langue,
            
        
      ,
     
      (err, docs) => 
        if (!err) return res.send(docs);
        if (err) return res.status(500).send( message: err );
      
    );
     
catch (err) 
  return res.status(500).json( message: err );
  
  
;

ejs:

<table class="tablebox tableskill">
   <thead>
   <th>Langues</th>
   <th>Niveau</th>
</thead>
<tbody>
   <div  style="display: none;"><p id="id_user_skill"><%= user._id%></p></div>
<% for(let j = 0; j < user.skills.length; j++)  %>
   <tr>
   <td>
     <input class="skilllist" type="text" name="skill" value="<%= user.skills[j].skill %>" >
   </td>
   <td>
      <input type="text" name="level" value="<%= user.skills[j].level %>">
   </td>
   <td>
      <a class="deleteskill" data-user-id="<%= user._id%>" data-id="<%= user.skills[j].skill %>" >
         <span class="material-icons icon-table delete-btn">
            clear
         </span>
      </a>
   </td>
   </tr>
<%  %>
</tbody>
</table>

JS文件（ejs中引用）：

userid = document.getElementById('id_user_skill');

if (window.location.pathname == "/user/edit-user" || window.location.search == `?id=$userid` ) 

  $ondelete = $(".tableskill tbody td a.deleteskill");

  $ondelete.click(function () 

    let id = $(this).attr("data-id");
    let iduser = $(this).attr("data-user-id");
    let skilldata = `skill: $id`

    let deleteskill = 
      url: `/api/user/deleteskills/$iduser/$id`,
      method: "PUT",
      data: skilldata
    ;

    $.ajax(deleteskill).done(function (response) 
      location.reload();
    );

  );

 

欢迎询问更多信息

【参考方案1】：

document.getElementById('id_user_skill'); 将返回 Element 而不是 userId。在你的情况下，$('#id_user_skill').text(); 会帮助你。而且skill: $id 不是正确的数据。

对于application/x-www-form-urlencoded Content-Type（在ExpressJS中，你必须使用app.use(express.urlencoded());）

userid = $('#id_user_skill').text().trim();

if (window.location.pathname == "/user/edit-user" || window.location.search == `?id=$userid` ) 

  $ondelete = $(".tableskill tbody td a.deleteskill");

  $ondelete.click(function () 

    let id = $(this).attr("data-id");
    let iduser = $(this).attr("data-user-id");
    let skilldata = 
      skill: id
    

    let deleteskill = 
      url: `/api/user/deleteskills/$iduser/$id`,
      method: "PUT",
      data: skilldata
    ;

    $.ajax(deleteskill).done(function (response) 
      location.reload();
    );

  );

 

对于application/json Content-Type（在ExpressJS中，你必须使用app.use(express.json());）

userid = $('#id_user_skill').text().trim();

if (window.location.pathname == "/user/edit-user" || window.location.search == `?id=$userid` ) 

  $ondelete = $(".tableskill tbody td a.deleteskill");

  $ondelete.click(function () 

    let id = $(this).attr("data-id");
    let iduser = $(this).attr("data-user-id");
    let skilldata = 
      skill: id
    

    let deleteskill = 
      url: `/api/user/deleteskills/$iduser/$id`,
      method: "PUT",
      data: JSON.stringify(skilldata),
      headers: 
        'Content-Type': 'application/json'
      
    ;

    $.ajax(deleteskill).done(function (response) 
      location.reload();
    );

  );