Picture of Nicolas Kønig
Sub views
by Nicolas Kønig - Thursday, 9 December 2021, 2:24 PM
 

Hi I'm trying to create a sub view of an outer view.

The sub view (subView.js) needs to be connected to a partials (handlebars). In addition, the sub view needs to listen to certain events.

I can make the partials and the subview, but I have problems when the OuterView.js needs to render its children views and the events from the subView are not handled.

I've seen some examples with OuterView.js calling this.addChildrenView(subView). Other examples with backbone.js I have seen where they do something like:

 

var OuterView = Backbone.View.extend({
    initialize: function() {
        this.inner = new subView();
    },

    render: function() {
        this.$el.html(template); // or this.$el.empty() if you have no template
        this.$el.append(this.inner.$el);
        this.inner.render();
    }
});

var subView = Backbone.View.extend({
    render: function() {
        this.$el.html(template);
        this.delegateEvents();
    }
});

 

Can you point me to some more information on handling sub views and the Adapt framework.

 

Picture of Oliver Foster
Re: Sub views
by Oliver Foster - Monday, 13 December 2021, 10:46 AM
 

AdaptView.addChildren handles subviews / children for Pages, Articles, Blocks (not Components), it isn't meant for use elsewhere.

If you're using a recent version of the framework, it may be easier for you to use jsx for rendering rather than handlebars. 

Here are some fabulous examples from the community, https://github.com/nachocinalli/

mcq, gmcq, accordion etc have jsx versions.

 

Otherwise, the code you posted above should work just fine.