Dynamic Repeaters in Blocks

Dynamic repeaters are designed specifically for app building. Unlike standard repeaters used in site building, where you can edit each item individually directly on the canvas, dynamic repeaters require code or a connection to a CMS collection for content management. In dynamic repeaters, if you try to edit one item directly on the canvas, all items will be edited simultaneously. Dynamic repeaters also support advanced features like adding widgets or nesting them.

Connect dynamic repeaters to collections without code

You can connect a dynamic repeater to a CMS collection using data binding without writing code. However, for nested repeaters, this method is only applicable to the outer repeater.

To connect a dynamic repeater to a collection without code:

1. Select the repeater in your widget.
2. Click the Connect to CMS icon.

Learn more about connecting elements to collections without code.

Connect dynamic repeaters to collections using code

Dynamic repeaters can also be connected to CMS collections programmatically using the wix-data module. This gives you more control over the content being displayed. For example:

This allows you to manipulate and update the data in the repeater based on the query results from your collection.

Learn more about connecting dynamic repeaters to collections using code.

Add widgets to dynamic repeaters

To add a widget to a dynamic repeater:

1. Add a repeater to your widget.
2. Create another widget in your app.
3. Open the Add + panel and select My Widgets.
4. Drag the second widget into the repeater in the first widget until the Attach indication appears.
5. The second widget will now act as a nested widget and will appear in all repeater cells.

If the nested widget contains its own repeater, refer to nesting repeaters for additional guidance.

Reference dynamic repeaters in code

Dynamic repeaters are referenced in code using the $w API, similar to standard repeaters. You can manipulate their data and appearance programmatically with the $w.Repeater methods, which provide access to all repeater-specific functionality. This allows you to update and customize dynamic repeaters directly through your app’s code.

Nest dynamic repeaters

Dynamic repeaters support nesting, which can be done in two ways:

1. Direct Nesting: Drag one repeater directly into another. In this setup, the inner repeater can only connect to a collection through code.
2. Nesting a Widget with a Repeater: Create a widget that contains a repeater, then nest this widget inside another repeater.

For detailed examples, refer to the Nesting Repeaters documentation.

Does Blocks also have standard repeaters?

You can no longer add standard repeaters in Blocks, as they are not available in the Add Panel. However, if you have older apps that include standard repeaters, they will continue to function as expected.

Keep in mind that standard repeaters have limitations: they cannot be nested or hold widgets. If you attempt to use any new features, such as nesting or adding widgets, a migration process will be triggered. This process converts all standard repeaters in your app into dynamic repeaters, enabling them to support these features.