Question

使用Marionette和Coffeescript。

我正在努力允许用户检查视图模型上的框，然后更改所有已检查模型上的一个属性（例如，您可以在Gmail中执行此操作）。

现在我正在计划将复选框的id设置为模型的id，并使用jQuery抓取所有复选框的ID并一次更新一个模型，可能通过接收到的集合上的函数ID数组和要更改的属性。

我的问题是：这样做是否有一种特别整洁的“骨干方式”？或者沿着这些方向的任何建议？原谅我的一般性，我不太擅长了解骨干方式，而且谷歌的搜索没有太多。

修改

所以我最终像下面这样做了。我还在视图上有一个selectAll和deselectAll来检查/取消选中所有复选框。我没有更新模型以反映已检查或未检查，因为它似乎没有必要，因为检查状态由于任何原因没有预先存在，并且看起来像selectAll或deselectAll上的大量更新模型是不必要的工作。复选框的ID是该视图的模型ID。

系列：

class MyCollection extends Backbone.Collection
  model: MyModel
....
  batchSave: (ids, attrs) ->
    for id in ids
      @get(id).save attrs, patch: true

在视图中：

class MyComposite extends Marionette.CompositeView
  events:
    'click .batch-attribute a' : 'attributeSelected'

  prioritySelected: (e) ->
    e.preventDefault()
    ids = $('.edit-select:checked').map( -> @id ).get()
    attr = {attr: e.currentTarget.dataset.value}
    @collection.batchSave ids, attr

Answer 1

理想情况下，您将拥有一个集合视图和一组项目视图，如下所示：

＆＃13;

var Checks = Backbone.Collection.extend({});
var checks = new Checks([{}, {}, {}]);
var CheckView = Backbone.View.extend({
  initialize: function() {
    this.render();
  },
  events: {
    'click input': 'check'
  },
  render: function() {
    this.$el.append('<input type="checkbox">').appendTo('body');
  },
  check: function(event) {
    this.model.set('selected ', $(event.target).is(':checked'));
  }
});
checks.each(function(model) {
  new CheckView({
    model: model
  });
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>

＆＃13;

每个项目视图都负责将其标记为已选择。稍后您可以从集合视图中找到所选模型，例如this.collection.where({selected:true});

在Backbone.Marionette上更新多个模型

1 个答案: