如何在CompositeView中使用两个不同的集合

时间:2014-03-13 16:25:48

标签: marionette

我是Marionette的新手 我正在尝试创建一个视图,其中我需要显示下拉列表和表格 下拉列表从集合中呈现。并根据下拉列表中选择的值,我需要在表格中呈现集合。

请告诉我如何实现这种观点?

由于

**更新**

我试图像

那样实现这个目标

http://jsfiddle.net/H8AZY/17/

var compositeView = Marionette.CompositeView.extend({
    template : Handlebars.compile($("#sample-template").html()),
    itemView: itemview,
    itemViewContainer: 'tbody',
    templateHelpers: function(){
        var helpers = {};
        console.log(this.coll.models);
        helpers.users = this.coll.models;
        return helpers;
    },
    triggers: {
    'change select': 'selectName'
    },
    ui:{
        select: 'select'
    },
    onSelectName: function() {
        console.log(this.ui.select.val());
        var newModel = this.coll.findWhere({name: this.ui.select.val()});   
        //this.collection = new Backbone.Collection(newModel.get('res'));
       this.collection.reset(newModel.get('res'));
    },
    initialize: function(options) {
        this.coll = options.coll;
        this.collection = new Backbone.Collection();
    }
});

这是实现我想要的好方法吗?

1 个答案:

答案 0 :(得分:0)

有两种方法可以实现这一目标。

您可以手动创建DOM。

class MyCompositeView extends Marionette.CompositeView
  ui:
    "select" : "select.my-select"
  onRender: ->
    _.each @options.states, (state) =>
      $option = $("<option>", { id: state.id, 
                                value: state.get("name") })
      this.ui.select.append($option)

view = new MyCompositeView({collection: this.collection, states: stateCollection });

或者您可以为您的选择创建一个完整的CollectionView:

class StateView extends Marionette.ItemView
  tagName: "option"

class StateCollectionView extends Marionette.CollectionView
  tagName: "select"
  itemView: StateView