Question

我正在流星应用程序中构建一个管理面板，以便能够管理应用程序的用户。目前，我正在向所有用户显示每个用户的下拉列表以更改其角色。

我需要在最后点击某个确认按钮后更新已更改的角色。

我有一个模板，使用用户名和用户当前角色的下拉列表进行渲染，我的模板类似于：

return x;

这会渲染我在数据库中拥有的用户数量。我需要更新所有用户，这些用户在点击按钮后会更改其角色。

我目前的做法是将用户ID插入下拉列表：

<div class="ui selection dropdown"> <input type="hidden" name="role"> <i class="dropdown icon"></i> <div class="default text">{{role}}</div> <div class="menu"> <div class="item" data-value="admin">Admin</div> . . . <div class="item" data-value="user">User</div> </div> </div>

然后我有一个用于下拉更改的事件处理程序并捕获值：

<div class="ui selection dropdown" id={{_id}}>

现在我想知道是否应该在某些会话密钥中推送这些Template.templateName.events({ "change .ui.selection.dropdown": function(event, template) { var id = template.find(".ui.selection.dropdown").id; var role = template.find("input[name=role]").value; ... }, });对并在点击id,role按钮后更新用户，或者有更好更有效的替代方案？

Answer 1

您可以在已更改的元素中添加一个属性，指示该元素已更改，而不是将它们保存在会话变量中并清除模板＆＃39; destroyed回调中的会话变量。单击“保存”按钮时，可以使用attribute selector获取此用户更改的所有元素。请参阅下面的代码示例以获取进一步的参考。

Template.templateName.events({
  "change .ui.selection.dropdown": function(event, template) {
    var target = $(event.target);
    target.attr("data-changed", "data-changed");
  },
  "click #saveButtonId": function(event, template) {
    var changedElements = template.$(".ui.selection.dropdown[data-changed]");
    var changedItems = [];

    for (var i = 0; i < changedElements.length; i++) {
       var changedElement = changedElements[i];
       changedItems.push({ id: changedElement.id, value: changedElement.value });
       // or
       //changedItems.push([changedElement.id, changedElement.value]);

    }
    // here you can call a meteor method like
    // Meteor.call('updateUserRoles', changedItems); //this updateUserRoles will now get only changed items that you can update in your DB.
  }
});

根据多个下拉列表更新文档

1 个答案: