advanced custom fields can’t do nested loops repeater inside repeater have_rows() not doing anything

I have a repeater inside a repeater and I need to loop what is in it.

I’m following this: https://www.advancedcustomfields.com/resources/have_rows/

This is my field structure:

agenda_section_events (parent/repeater)
    agenda_event_time_pacific (text)
    agenda_event_time_eastern (text)
    agenda_event_title (text)
    agenda_event_speakers (repeater)
        agenda_event_speaker_headashot (image array)
        agenda_event_speaker_name (text)
        agenda_event_speaker_title (text)
        agenda_event_speaker_content (wysiwyg editor)

So with that in mind, as I understand it, I need to loop over agenda_section_events and inside that I need to get rows https://www.advancedcustomfields.com/resources/have_rows/

So that code looks like this:

<div class="tc__agenda-items">
  <?php foreach($agendaSectionEvents as $agendaSectionEvent): ?>
    <div class="tc__agenda-item">
      <div class="tc__agenda-time">
        <div class="tc__agenda-time--pacific">
          <?php echo $agendaSectionEvent['agenda_event_time_pacific'] ?>
        </div>
        <div class="tc__agenda-time--eastern">
          <?php echo $agendaSectionEvent['agenda_event_time_eastern'] ?>
        </div>
      </div>
      <h3><?php echo $agendaSectionEvent['agenda_event_title'] ?></h3>
      <div class="tc__agenda-speaker-list">
        <!-- DEBUG LINE - BUT ITS EMPTY -->
        <div style="color: red;"><?php echo have_rows('agenda_event_speakers') ?></div>
        <?php if(have_rows('agenda_event_speakers')): ?>
          <div class="tc__agenda-speaker">
            <?php while(have_rows('agenda_event_speakers')): ?>
              <div class="tc__agenda-speaker-headshot">
                <img src="<?php the_sub_field('agenda_event_speaker_headashot')['url'] ?>" alt="<?php the_sub_field('agenda_event_speaker_headashot')['alt'] ?>">
              </div>
              <div class="tc__agenda-speaker-info">
                <h4><?php the_sub_field('agenda_event_speaker_name') ?></h4>
                <p><?php the_sub_field('agenda_event_speaker_title') ?></p>
              </div>
            <?php endwhile ?>
          </div>
        <?php endif ?>
      </div>
      <a href="#">Learn More</a>
    </div>
  <?php endforeach ?>
</div>

I’m really confused because all my field names are right, and the fields inside the second loop are sub fields but nothing is showing.

Why would that be?

I then thought its because I did a have rows inside a for each so then I tried doing a while inside a while like the acf docs

  <div class="tc__agenda-items">
    <?php while(have_rows('agenda_section_events')): ?>
      <div class="tc__agenda-item">
        <div class="tc__agenda-time">
          <div class="tc__agenda-time--pacific">
            <?php echo $agendaSectionEvent['agenda_event_time_pacific'] ?>
          </div>
          <div class="tc__agenda-time--eastern">
            <?php echo $agendaSectionEvent['agenda_event_time_eastern'] ?>
          </div>
        </div>
        <h3><?php echo $agendaSectionEvent['agenda_event_title'] ?></h3>
        <div class="tc__agenda-speaker-list">
          <!-- DEBUG LINE - BUT ITS EMPTY -->
          <div style="color: red;"><?php echo have_rows('agenda_event_speakers') ?></div>
          <?php if(have_rows('agenda_event_speakers')): ?>
            <div class="tc__agenda-speaker">
              <?php while(have_rows('agenda_event_speakers')): ?>
                <div class="tc__agenda-speaker-headshot">
                  <img src="<?php the_sub_field('agenda_event_speaker_headashot')['url'] ?>" alt="<?php the_sub_field('agenda_event_speaker_headashot')['alt'] ?>">
                </div>
                <div class="tc__agenda-speaker-info">
                  <h4><?php the_sub_field('agenda_event_speaker_name') ?></h4>
                  <p><?php the_sub_field('agenda_event_speaker_title') ?></p>
                </div>
              <?php endwhile ?>
            </div>
          <?php endif ?>
        </div>
        <a href="#">Learn More</a>
      </div>
    <?php endwhile ?>
  </div>
<?php endif ?>

Since implementing this change, now the page just…doesn’t load!? What!?

How do you do a nested for loop in advanced custom fields?

Answer

You need to add the_row(); inside your while loops. All ACF loops are formatted the same, nested or not. Something I do to keep it easy is make the if/while/the_row stuff all one line, see below:

Start loops like this:

<?php if (have_rows('agenda_section_events')): while (have_rows('agenda_section_events')) : the_row(); ?>

End loops like this:

<?php endwhile; endif; ?>

You can go wild with the number of loops you want to nest, just simply copy the parent loop lines and create a nested one, then change your row to the nested one of course.

I adjusted your code below, give this a shot.

You should also define your subfield array values inside the loop you’re using it with, just keeps things cleaner – or just use the_sub_field to echo your subfield values since its a short function anyway.

<div class="tc__agenda-items">
<?php if (have_rows('agenda_section_events')): ?>
 <?php while (have_rows('agenda_section_events')) : the_row(); ?>
    <div class="tc__agenda-item">
        <div class="tc__agenda-time">
            <div class="tc__agenda-time--pacific">
                <?php echo $agendaSectionEvent['agenda_event_time_pacific'] ?>
            </div>
            <div class="tc__agenda-time--eastern">
                <?php echo $agendaSectionEvent['agenda_event_time_eastern'] ?>
            </div>
        </div>
        <h3><?php echo $agendaSectionEvent['agenda_event_title'] ?></h3>
        <div class="tc__agenda-speaker-list">
            <!-- DEBUG LINE - BUT ITS EMPTY -->
            <div style="color: red;"><?php // echo have_rows('agenda_event_speakers') ?></div>
            <?php if (have_rows('agenda_event_speakers')) ?>
            <div class="tc__agenda-speaker">
                <?php while (have_rows('agenda_event_speakers')) : the_row(); ?>
                <div class="tc__agenda-speaker-headshot">
                    <img src="<?php the_sub_field('agenda_event_speaker_headashot')['url'] ?>" alt="<?php the_sub_field('agenda_event_speaker_headashot')['alt'] ?>">
                </div>
                <div class="tc__agenda-speaker-info">
                    <h4><?php the_sub_field('agenda_event_speaker_name') ?></h4>
                    <p><?php the_sub_field('agenda_event_speaker_title') ?></p>
                </div>
                <?php endwhile ?>
            </div>
            <?php endif ?>
        </div>
        <a href="#">Learn More</a>
    </div>
    <?php endwhile ?>
<?php endif ?>

Advertisement

Answer