0
votes

Essentially what I'm trying to do is loop through a repeater field (ACF, working in WordPress) to pick out 1 sub-field, and after the first items in the loop run a second loop to pick up another sub-fields.

  • Loop 1 starts
    • Item 1, field 1
    • Item 2, field 1
    • Item 3, field 1
  • Loop 1 stops
  • Loop 2 starts
    • Item 1, field 2
    • Item 2, field 2
    • Item 3, field 2
  • Loop 2 stops
  • Loop 1 restarts
    • Item 4, field 1
    • Item 5, field 1
    • Item 6, field 1
  • Loop 1 stops
  • Loop 2 restarts
    • Item 4, field 2
    • Item 5, field 2
    • Item 6, field 2
  • Loop 2 stops

For example, if I have a repeater with two subfields "title" and "content" the output would look something like this:

<div class="row">

  <div class="column">
    <div class="tabs-title">
      <h3>Item 1 Title</h3>
      <a href="#panel1">Learn More</a>
    </div>
  </div>
  <div class="column">
    <div class="tabs-title">
      <h3>Item 2 Title</h3>
      <a href="#panel2">Learn More</a>
    </div>
  </div>
  <div class="column">
    <div class="tabs-title">
      <h3>Item 3 Title</h3>
      <a href="#panel3">Learn More</a>
    </div>
  </div>

  <div class="tabs-panel" id="panel1">
    <div class="tabs-content">
      <p>Item 1 content goes here.</p>
    </div>
  </div>
  <div class="tabs-panel" id="panel2">
    <div class="tabs-content">
      <p>Item 2 content goes here.</p>
    </div>
  </div>
  <div class="tabs-panel" id="panel3">
    <div class="tabs-content">
      <p>Item 3 content goes here.</p>
    </div>
  </div>

</div>

<!-- Repeat loop until the end -->

So far, this is what I have. Just not sure how to execute the second loop before closing div every 3rd option.

<?php if( have_rows('services') ) :
  $i = 1;
  $divopen = '<div class="cta row row-3 small-up-1 large-up-3 tabs" data-tabs id="example-tabs">';
  echo $divopen;
  while( have_rows('services') ) : the_row(); ?>

    <div class="column">
      <div class="tabs-title">
        <h3><?php the_sub_field('service_name'); ?></h3>
        <a href="#panel<?php echo $i; ?>">Learn More</a>
      </div>
    </div>

    <?php if($i % 3 == 0) :
      echo '</div>' . $divopen;
    endif;

  $i++; endwhile; echo '</div>';
endif; ?>
1

1 Answers

0
votes

Hope that you can find this solution the correct one, you can loop through an array and create a table structure like this (this answer is according to my understanding):

$array = [
    [
        [
            'title' => "My Title 1",
            'content' => 'Content 1',
        ],
        [
            'title' => "My Title 2",
            'content' => 'Content 2',
        ],
        [
            'title' => "My Title 3",
            'content' => 'Content 3',
        ],
    ],
    [
        [
            'title' => "My Title 4",
            'content' => 'Content 4',
        ],
        [
            'title' => "My Title 5",
            'content' => 'Content 5',
        ],
    ],
];

echo "<table style='border: 1px solid black;'><tbody>";
foreach ($array as $key => $arr) {
    echo "<tr> . '<br>'";
    foreach ($arr as $key => $value) {
        echo "<td style='border: 1px solid black;'>";
        echo $value['title'];
        echo $value['content'];
        echo '</td>';
    }
    echo "<tr>";
}
echo "</tbody></table>";

Hope this helps!