Dynamically Creating Repeater Components
Is it possible to add components to an enyo.Repeater at runtime?
I'm trying to create a Repeater that can render different controls in the row based on the data it retrieves from the server, so the declarative approach hasn't been a good fit.
I've tried adding the components in create and rendered, calling render on the repeater after adding the component or just calling setCount, but the repeater is always rendered as an empty div.
fiddle: jsfiddle.net/7u5qxh7q/3/
I'm trying to create a Repeater that can render different controls in the row based on the data it retrieves from the server, so the declarative approach hasn't been a good fit.
I've tried adding the components in create and rendered, calling render on the repeater after adding the component or just calling setCount, but the repeater is always rendered as an empty div.
fiddle: jsfiddle.net/7u5qxh7q/3/
enyo.kind({
name: "TestView",
components: [
{kind: "onyx.Button", content: "Go", ontap: "buildRepeaterItems"},
{name: "repeater", kind: "enyo.Repeater"}
],
buildRepeaterItems: function (inSender, inEvent) {
this.$.repeater.createComponent(
{name: "lineItem", content: "foo"},
{owner: this.$.repeater}
);
this.$.repeater.render();
this.$.repeater.setCount(5);
}
});
Thanks for any help you can provide! Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
fiddle: http://jsfiddle.net/7u5qxh7q/4/
buildRepeaterItems: function (inSender, inEvent) { this.createComponent( {name: "repeater", kind: "enyo.Repeater", components: [ {content: "Foo"} ]}, {owner: this} ); this.$.repeater.setCount(5); }But it seems strange to me that it's not possible to create or alter the row itself.enyo.RepeaterI reworked your fiddle:It will do what you want. Most likely there is a better way. This is quick and dirty.
http://jsfiddle.net/7u5qxh7q/5/
1. Include all possible controls within the repeater but only render the appropriate one for the data. http://jsfiddle.net/7u5qxh7q/6/
2. Create a sub-kind of Repeater with the desired internal controls for each kind of data and create the right one at runtime for the data. This gives you reasonable separation of concerns between views and encapsulation of the view setup.
3. Skip Repeater and set up the controls yourself. Repeater can be convenient but really is pretty simple. You can emulate the same behavior by iterating over your data set and creating the desired control for each. If you need to rerender, you can call
destroyClientControls()on the container and run your creation logic again.Ryan