On octobercms static pages plugin render a group of fields with a repeater inside

Question

On "content/static-pages/index.htm" i can see the saved fields that can be rendered on page:

Then on partials i can use {{ data.section_color }} to render a field.

Now i want to create a repeater field inside "meta/groups.yaml" like this:

carousel2:
  name: Carousel2
  description: Carousel2
  icon: icon-file-image-o
  fields:
    section_carousel2:
       type: repeater
       prompt: Add new subitem
       form:
          fields:
            section_carouselimage2:
              label: Image2
              type: mediafinder
              mode: image
            section_carouseltitle2:
              label: Title2
              type: text
            section_carouselsubtitle2:
              label: Subtitle2
              type: textarea
              size: small

I can see the field on my backend and i can save data with it. On "content/static-pages/index.htm" now i have:

[viewBag]
title = "Home"
url = "/"
layout = "static"
is_hidden = 0
navigation_hidden = 0
sections[0][section_carousel2][1][section_carouselimage2] = "/carousel/bg-1.jpg"
sections[0][section_carousel2][1][section_carouseltitle2] = "Carousel2 Title"
sections[0][section_carousel2][1][section_carouselsubtitle2] = "Carousel2 Subitle"
sections[0][section_carousel2][2][section_carouselimage2] = "/carousel/bg-2.jpg"
sections[0][section_carousel2][2][section_carouseltitle2] = "Carousel2 Title2"
sections[0][section_carousel2][2][section_carouselsubtitle2] = "Carousel2 Subtitle2"
sections[0][_group] = "carousel2"
==

The problem is that i can't find a way to render this field. How can i render repeater field inside repeater group? How can i render for example "section_title2" field?

Hardik Satasiya · Accepted Answer · 2017-12-02T18:03:33.637

Hmm, lest assume that you are adding carousel2

ok we added it's markup in the meta/groups.yaml so basically we are making carousel2 group.

so now solution , how we show its information/data.

first we need to create partial in cms blocks/carousel2 so carousel2 will be placed in blocks folder where other partials are (simple / react / etc ...).

ok now we need to add this content inside it

<section>
  <!-- render inner section -->
    {% for slide in data.section_carousel2 %}
        <!-- this block will repeat / based on added slides( so probably slider markup will be here) -->
        <p>{{ slide.section_carouselimage2 }}</p>
        <p>{{ slide.section_carouseltitle2 }}</p>
        <p>{{ slide.section_carouselsubtitle2 }}</p>        
    {% endfor %}
</section>

ok now you can access all fields inside for loop. we used loop because your group is repeater.

let's understand it a bit.

data : = this variable is passed to each partial. its data regarding your group, in our case its carousel2

now data has 2 things first : group name , second our real data which we saved in page.

to get that saved data we can use data.section_carousel2 now as we know its type of repeater so to get that data we need to add for loop.

now in for loop we used slide variable which will get all data for all fields within repeater for each iteration.

so now within this loop you have your fields slide.section_carouselimage2 as we declared in meta/groups.yaml file.

If anything is not clear or if its not working please comment.

Εxcellent explanation. I missed the "data." inside for loop. Now is working. Thank you. — Charis, Dec 04 '17 at 18:45

On octobercms static pages plugin render a group of fields with a repeater inside

1 Answers1