Wix Blocks: Connecting a Repeater to a Database Collection

Wix Blocks is currently open to a limited number of users.

Blocks allows you to connect a collection to a repeater. Note that Blocks collections are placeholders that allow you to interact with similar structured collections on your site later. To connect a repeater to a collection:

1. Create or open a Blocks widget through the Widgets and Design menu.

2. Add a repeater to your widget: go to the Add  panel and click LAYOUT > REPEATERS.

3. Create a collection in Blocks. 

4. Go to the code section of the widget and import the wix-data module:

   Copy Code
   import wixData from 'wix-data';

5. Query the data in the collection with this syntax (learn more about your app namespace):

   @<yourAppNamespace>/<yourCollecitonName>

   For example, the following function gets strings from a collection named "Titles" and assign them to the text elements in a repeater:

   Copy Code
   $w.onReady(function () {
   wixData.query('@daphnet2/simple-repeater-app/Titles')
   .find()
         .then((results) => {
             $w('#repeater1').data = results.items
         })
         .catch((err) => {
             console.log(err)
             throw new Error(err)
         });
       $w("#repeater1").onItemReady(($item, itemData, index) => {
         $item("#text1").text = itemData.title;
     });
   });

Find the repeater ID

An element's ID is displayed in several places:

• In the Design tab, when you hover over or select an element.
• In the Layers panel, when you select an element.
• In the Properties & Events panel , when you select an element.