Support

Account

Home Forums Front-end Issues wrapping repeater field inside divs depending of select sub field

Helping

wrapping repeater field inside divs depending of select sub field

  • I’m using ACF on my website.

    I have a repeater field named “reference”, and inside of this field, sub fields with name, and a select list with 6 values.

    What I’m trying to do is to display on a page all the rows that have the select choice value “finance”, and to wrap every 4 rows into a div.

    here is the code I have, without wrapping the rows :

    
        <div class="row row_tabs">
    
            <?php if(get_field('reference', 64)):?>
    
            <?php while(has_sub_field('reference', 64)):?>
    
            <?php if(get_sub_field('categorie') == "finance"):?>
    
            <div class="col-xs-3 text-center">
    
                <div class="inside">
    
                    <?php $image = get_sub_field('logo'); ?>
    
                    <?php if($image):?>
    
                    <img data-src="<?php echo $image['sizes']['medium']; ?>" class="lazyload" />
    
                    <?php endif; ?>
    
                </div>
    
            </div>
    
            <?php endif; ?>
    
            <?php endwhile; endif; ?>
    
        </div>

    and here is what I’ve tried so far, but it’s not working fine…

      <div class="row row_tabs">
    
            <?php if(get_field('reference', 64)): $counter = 0;?>
    
            <?php while(has_sub_field('reference', 64)):?>
    
            <?php if(get_sub_field('categorie') == "finance"):?>
    
            <div class="col-xs-3 text-center">
    
                <div class="inside">
    
                    <?php $image = get_sub_field('logo'); ?>
    
                    <?php if($image):?>
    
                    <img data-src="<?php echo $image['sizes']['medium']; ?>" class="lazyload" />
    
                    <?php endif; ?>
    
                </div>
    
            </div>
    
            <?php if ($counter % 4 == 0) : ?>
    
            </div>
    
            <div class="row row_tabs">
    
            <?php endif; ?>
    
            <?php endif; ?>
    
            <?php endwhile; endif; ?>
    
        </div>

    There is also this solution, but It counts all the repeater field, not the repeater field label “finance”.

    <?php if ( get_field( 'reference', 64) ): ?>
    
        <?php $index = 1; ?>
        <?php $totalNum = count( get_field('reference', 64) ); ?>
    
        <div class="row row_tabs">
    
        <?php while ( has_sub_field( 'reference' ) ): ?>
    
            <div class="col-sm-4">
                <?php the_sub_field( 'copy' ); ?>
            </div>
            <? if ($index % 4 == 0) : ?>
                <? if ($index < $totalNum) : ?>
    
                    <div class="col-xs-3 text-center">
    
                        <div class="inside">
    
                            <?php echo $counter ++;?>
    
                            <?php $image = get_sub_field('logo'); ?>
    
                            <?php if($image):?>
    
                            <img data-src="<?php echo $image['sizes']['medium']; ?>" class="lazyload" />
    
                            <?php endif; ?>
    
                        </div>
    
                    </div>
                </div>
    
                <div class="row row_tabs">
    
                <? elseif ($index == $totalNum) : ?>
                    </div>
                <? endif; ?>
    
            <? endif; ?>
    
        <?php $index++; ?>
        <?php endwhile; ?>
    
    <?php endif; ?>

    I would need to combine those codes to get a correct one. Counting the rows that are labeled “finance”, and then wrap them into different divs.

    can anybody help me with this ?

  • Hi @intramorosgmail-com

    I believe you can do it like this:

    <div class="row row_tabs">
    
        <?php if(get_field('reference', 64)): $i = 0;?>
    
        <?php while(has_sub_field('reference', 64)):?>
    
        <?php if(get_sub_field('categorie') == "finance"):?>
        
        <?php if ($i % 4 == 0) { ?>
        
        <div class="row row_tabs">
        
        <?php } ?>
    
        <div class="col-xs-3 text-center">
    
            <div class="inside">
    
                <?php $image = get_sub_field('logo'); ?>
    
                <?php if($image):?>
    
                <img data-src="<?php echo $image['sizes']['medium']; ?>" class="lazyload" />
    
                <?php endif; ?>
    
            </div>
    
        </div>
        
        <?php $i++; ?>
    
        <?php if ($i % 4 == 0) { ?>
        
        </div>
        
        <?php } ?>
    
        <?php endif; ?>
    
        <?php endif; ?>
    
        <?php endwhile; endif; ?>
    
    </div>

    Please learn more about PHP here: http://www.w3schools.com/php/.

    I hope this helps.

Viewing 2 posts - 1 through 2 (of 2 total)

The topic ‘wrapping repeater field inside divs depending of select sub field’ is closed to new replies.