Я использую вкладки Bootstrap для отображения сетки с профилями сотрудников и фотографиями в полях повторителя ACF, а при нажатии на профиль появляется модал начальной загрузки с информацией, заполненной в подполе ретранслятора.
Все работает нормально, но когда вы нажимаете на разные профили, одна и та же информация профиля находится в модальной, а не другая информация профиля.
Вот мой код
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="team" role="tabpanel" aria-labelledby="team-tab">
<div class="row justify-content-md-between">
<?php
if( have_rows('team_profile_boxes') ):
$i = 1;
// loop through the rows of data
while ( have_rows('team_profile_boxes') ) : the_row(); ?>
<div id="profile-box">
<div class="profile-image-box">
<div class="profile-image" style="background-image: url('<?php echo the_sub_field('profile_image'); ?>');"></div>
<div class="profile-image-hover" style="background-image: url('<?php echo the_sub_field('second_profile_image'); ?>');"></div>
</div>
<div class="profile-details">
<a data-toggle="modal" href="#exampleModal">
<h4>
<span><?php the_sub_field('division_title'); ?></span>
<br>
<?php the_sub_field('profile_name'); ?> <br>
<span><?php the_sub_field('job_title'); ?></span>
</h4>
</a>
</div>
</div>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-body">
<?php the_sub_field('profile_information'); ?>
</div>
</div>
</div>
</div>
<?php $i++;
endwhile;
else :
// no rows found
endif;
?>
</div>
</div>
Я просмотрел этот пример, но, похоже, он не применим: ACF Repeater + Modal