0

マルチステップウィザードにProductListView複数の子ビューを含む親ビューがあります。ProductViewユーザーがをクリックするとProductView、そのモデルのIDがどこかに(場合によっては配列に)格納され、処理のためにサーバー側に送り返されるようにする必要があります。

問題:ユーザーがクリックしたのをidどこに保存すればよいですか?ProductView親ビューに保存しようとしましたが、子ビューから親ビューProductListViewの配列にアクセスできないようです。selectedProductsProductView

これは正しいアプローチですか?これはどのように行う必要がありますか?

モデル

ProductCollection = Backbone.Collection.extend({
    model: Product,
    url: '/wizard'
});

親ビュー

ProductListView = Backbone.View.extend({
    el: '#photo_list',

    selectedProducts: {},  // STORING SELECTED PRODUCTS IN THIS ARRAY

    initialize: function() {
        this.collection.bind('reset', this.render, this);
    },

    render: function() {
        this.collection.each(function(product, index){
            $(this.el).append(new ProductView({ model: product }).render().el);
        }, this);
        return this;
    }
});

チャイルドビュー

ProductView = Backbone.View.extend({
    tagname: 'div',
    className: 'photo_box',

    events: {
        'click': 'toggleSelection'
    },

    template: _.template($('#tpl-PhotoListItemView').html()),

    render: function() {
        this.$el.html(this.template( this.model.toJSON() ));
        return this;
    },

    // ADDS ITS MODEL'S ID TO ARRAY
    toggleSelection: function() {
        this.parent.selectedProducts.push(this.model.id);
        console.log(this.parent.selectedProducts);
    }
});
4

2 に答える 2

2

parentバックボーンタイプのプロパティではないと思います。View定義していないので、この行が機能する方法はありません。

this.parent.selectedProducts.push(this.model.id);

正しいアプローチは、モデルにselectedプロパティを追加することのようです。Productクリックハンドラでそのプロパティを切り替えます。次に、サーバーに送信するときに、選択したアイテムのProductsコレクションをフィルタリングしてIDを収集します(Backboneに含まれているunderscore.jsを使用すると、これが簡単になります)。

于 2012-09-03T02:37:43.600 に答える
1

選択した情報をモデルに直接保持してみませんか。したがって、イベントを使用して選択した状態の変更を簡単に追跡し、その情報をウィザードの以降の手順で使用しますか?

toggleSelection: function () {
    this.model.set({ selected: true });
}
于 2012-09-03T08:21:40.617 に答える