EJS 在某些情况下只输出第一个找到的用户

Posted

技术标签:

【中文标题】EJS 在某些情况下只输出第一个找到的用户【英文标题】:EJS just outputs the first found user in some cases 【发布时间】:2019-10-21 08:19:35 【问题描述】:

我正在使用 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");
  
);

所有 标记在表格内有效,但在弹出 div 内无效。在弹出窗口中,它只显示来自数据库中第一个用户的信息,这非常奇怪。

我会非常感谢任何形式的帮助。谢谢!

【问题讨论】:

【参考方案1】:

您的 ejs 代码很好。我认为问题在于每个模态的 id。 对于每个用户,您使用id="con-close-modal" 生成一个模态,因此您所有的模态都具有相同的 id。结果,每个提交按钮(它们都有same 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>

【讨论】:

【参考方案2】:

我可能是错的,但由于弹出窗口仅显示来自第一个用户的信息,您可能需要将特定用户 ID 放在链接之外。我在一个项目中遇到了类似的问题,只是它是指向新视图的链接而不是弹出窗口。

我希望这个文档可能会有所帮助

https://mongodb.github.io/node-mongodb-native/api-bson-generated/objectid.html

【讨论】:

以上是关于EJS 在某些情况下只输出第一个找到的用户的主要内容,如果未能解决你的问题,请参考以下文章

在 ejs 中显示帖子的用户名

node.js express+ejs引擎构建第一个项目

如何在不跟踪的情况下只获取一次用户位置?

ejs模版的4种输出方式

使用Nodejs将数据发送到header.ejs

同一用户控件的不同WPF网格行大小规格取决于情况