Forum

Thread tagged as: Question

Conditionals in Repeaters - every nth or at the end.

I have the following repeater:

<perch:content id="width" type="select" label="Block width" suppress="true" options="Full width|full,Medium|medium,Thin|thin" default="full" />
<perch:content id="align" type="select" label="Text align" suppress="true" options="Left|,Center|text-center" help="Applies to all three columns" />
<perch:repeater max="12" id="threeUp" label="Three Up Block" scope-parent="true" >
    <perch:before>
        <div class="row">
            <div class="<perch:if id="width" value="full">col-md-12</perch:if><perch:if id="width" value="medium">col-md-8 col-md-push-2</perch:if><perch:if id="width" value="thin">col-md-6 col-md-push-3</perch:if>">
    </perch:before>
            <div class="col-sm-4 <perch:content id="parent.align" />">

                <perch:if exists="headingtext">
                    <h2><perch:content id="headingtext" type="smarttext" label="Heading text" order="1" /></h2>
                </perch:if>

                <perch:content id="text" type="textarea" label="Text" markdown="true" size="s" editor="markitup" imagewidth="640" imageheight="480" order="2" />

                <perch:if exists="yt_video OR vim_video">
                    <div class="embed-responsive embed-responsive-16by9">
                        <perch:if exists="yt_video">
                            <perch:content id="yt_video" type="youtube" width="800" label="YouTube URL" output="embed" />
                        <perch:else />
                            <perch:content id="vim_video" type="vimeo" width="800" label="Vimeo URL" output="embed" />
                        </perch:if>
                    </div>
                <perch:else />
                    <perch:if exists="image">
                        <perch:if exists="crop_image">
                            <img src="<perch:content id="image" type="image" label="Image" width="800" height="450" crop="true" help="Images 800px wide or wider will look best." />" class="img-responsive" alt="<perch:content id="logoalt" type="text" label="Alt text" />" />
                        <perch:else />
                            <img src="<perch:content id="image" type="image" label="Image" width="800" />" class="img-responsive" alt="<perch:content id="logoalt" type="text" label="Alt text" />" />                      
                        </perch:if>                         
                    </perch:if>
                    <perch:content type="checkbox" id="crop_image" value="1" label="Crop image to dimenions" suppress="true"  help="This will make sure all the images are the same height." />
                </perch:if>

                <perch:if exists="link OR page">
                    <p class="button">
                        <a href="<perch:if exists="link"><perch:content id="link" type="link" size="l" label="Link" help="Include a web address here." /><perch:else /><perch:content id="page" type="pagelist" label="Page" help="Link to a page on the site. Leave the 'link' field blank in order to use this option." /></perch:if>" class="list-group-item"><perch:content id="linktext" type="smarttext" label="Link text" /></a>
                    </p>
                </perch:if>
            </div>

    <perch:every count="3">
            </div>
        </div>
        <div class="row">
            <div class="<perch:if id="width" value="full">col-md-12</perch:if><perch:if id="width" value="medium">col-md-8 col-md-push-2</perch:if><perch:if id="width" value="thin">col-md-6 col-md-push-3</perch:if>">
    </perch:every>
    <perch:after>
            </div>
        </div>  
    </perch:after>
</perch:repeater>

It displays items in rows of three. So every three I close a row and open a new row using <perch:every>. I open my row in a <perch:before> and close it using a <perch:after>. This is fine as long as I don't have a multiple of three items (which I generally will have). When I have a multiple of three, I still open a new row (in my <perch:every>) and then close it again (in my <perch:after>).

Is there a way of having a conditional "if the total number of items isn't a multiple of three?".

Failing that, I could probably list the first few multiples of three in the conditional and make sure my repeater only has that many elements...?

Paul Bell

Paul Bell 0 points

  • 4 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

Add a <perch:every count="3"> with a perch:else in the perch:after.

Brilliant! Thanks Drew.