Вложенные вкладки с повторителем — Расширенные пользовательские поля WordPress

Я хочу сделать несколько вкладок в WordPress, используя плагин Advance Custom Field с модулем Repeater.

Это мой фактический код:

<?php

if( have_rows('menu_sections') ): ?>
<ul class="nav nav-tabs" id="" role="tablist">
<?php $i=0; while ( have_rows('menu_sections') ) : the_row(); ?>
<?php
$string = sanitize_title( get_sub_field('section_title') );
?>
<li role="presentation" <?php if ($i==0) { ?>class="active"<?php } ?>  >
<a  role="tab" data-toggle="tab"><?php the_sub_field('section_title'); ?></a>
</li>
<?php $i++; endwhile; ?>
</ul>

<div class="tab-content">
<?php $i=0; while ( have_rows('menu_sections') ) : the_row(); ?>
<?php
$string = sanitize_title( get_sub_field('section_title') );
?>
<div role="tabpanel" class="tab-pane text-left fade <?php if ($i==0) { ?>in active<?php } ?>" id="<?php echo $string; ?>">
<?php
while (have_rows('section_items')) {
the_row();
// Display each item as a list
?>
<ul>
<li class="list-unstyled"><?php the_sub_field('dish_name'); ?></li>
<li class="list-unstyled"><?php the_sub_field('dish_description'); ?></li>
<li class="list-unstyled"><?php the_sub_field('dish_price'); ?></li>
</ul>
<?php
} // end while have rows section_items
?>
</div>
<?php $i++; endwhile; ?>
</div>
<?php endif; ?>

Этот фактический код отображает это:

Теперь, если я выберу другую вкладку, она не изменит информацию о карте, как вы можете видеть на следующем изображении:

Я использую вкладки Bootstrap с CDN

Вот что отображает консоль Gooogle:

Поэтому я пробовал много разных способов, но безуспешно.

Я знаю, как сделать их без вложенного повторителя, и в этом случае я не знаю, почему это не работает. Я прочитал несколько других постов, но без особого успеха. Так что я думаю, что если он не показывает что-то с css ??

Я оценю помощь.
С уважением!