我正在使用 mongoDB 和 ejs 在一个表中显示我的所有用户。该表还有一些用于删除用户和更改用户角色的操作按钮。这些按钮会打开一个弹出窗口以更改角色或确认删除。但是 EJS 不会将用户信息传递到弹出窗口中。它在表格中工作得很好，但在弹出窗口中却不行。

带有角色更改弹出窗口的我的 EJS 用户表:

<tbody>
                  <%users.forEach(function(users){%>
                  <tr>
                    <td><%=users.name%></td>
                    <td><%=users.username%></td>
                    <td><%=users.createdAt%></td>
                    <td><span class="badge label-table badge-<%=users.role%>"><%=users.role%></span></td>
                    <td><span class="badge label-table badge-<%=users.verifyEmailToken%>"><%=users.verifyEmailToken%></span></td>
                    <td>
                      <button type="submit" class="btn btn-xs btn-success" data-toggle="modal" data-target="#con-close-modal" name="changeRoleButton"><i class="remixicon-user-settings-line"></i></button>
                    </td>
                  </tr>

                  <div id="con-close-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
                    <div class="modal-dialog">
                      <div class="modal-content">
                        <div class="modal-header">
                          <h4 class="modal-title">Change <%=users.name%> Role</h4>
                          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        </div>
                        <form class="" action="/changeuserrole" method="post">
                          <div class="modal-body p-4">
                            <div class="row">
                              <div class="col-md-12">
                                <div class="form-group">
                                  <label for="field-1" class="control-label">User Role</label>
                                  <select class="form-control" name="role">
                                    <option>Partner</option>
                                    <option>Admin</option>
                                    <option>User</option>
                                  </select>
                                </div>
                                <button type="submit" value="<%=users._id%>" name="userroleid" class="btn btn-primary">Submit</button>
                              </div>
                            </div>
                          </div>
                        </form>
        
                      </div>
                    </div>
                  </div>
                  <%});%>
                </tbody>

这是我的 app.js，我在其中搜索用户并将它们传递给 EJS:

    app.get("/users", function(req, res) {
    if (req.isAuthenticated() && req.user.role === "Admin") {

    User.find({}, function(err, foundUsers) {
      if (err) {
        console.log(err);
      } else {
        res.render("users", {
          users: foundUsers,
          name: req.user.name.replace(/ .*/, ''),
          email: req.user.username,
        });
      }
    });
  } else {
    res.redirect("/login");
  }
});

所有 <%=users...%> 标签都在表格内工作，但在弹出 div 内不起作用。在弹出窗口中，它只显示数据库中第一个用户的信息，这非常奇怪。

如有任何帮助，我将不胜感激。谢谢!

最佳答案

您的 ejs 代码很好。我认为问题出在每个模态的 ID。
你为每个用户生成一个带有 id="con-close-modal" 的模态，所以你所有的模态都有相同的 id。结果，每个提交按钮(它们都具有 相同的 data-target="#con-close-modal")触发相同的模式，可能是第一个。 我建议你，给每个模式一个唯一的 id，比如

<div id="<%= users._id %>" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">

并为每个提交按钮赋予正确的data-target属性

<button type="submit" ... data-target="#<%= users._id %>"...></button>

关于node.js - EJS 在某些情况下只输出第一个找到的用户，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56466974/