每个转发器字段的唯一ID（高级自定义字段）

Question

I'm creating wordpress page that has a program schedule. Im using advanced custom fields to allow us to easily fill parts the day and removing things etc. However each block has its own collapsible description with an href. When I'm creating the repeater it however keeps the id of that collapsible part the same and it doesn't work cause it would always open 'description 1'

My question: how can i apply a unique id (ie progam1, program2 etc) to each repeater loop. Ive tried it with $counter as seen in the code below, but I'm not sure how to correctly apply it.

<?php 
while ( have_rows('day_1') ) : the_row();

    $progtime             = get_sub_field('prog_time');
    $progtitle            = get_sub_field('prog_title');
    $progimage           = get_sub_field('prog_image');
    $progsubspeaker     = get_sub_field('prog_sub_speaker');
    $progsubdescription = get_sub_field('prog_sub_description');
    $progsubduration    = get_sub_field('prog_sub_duration');
    $progsublocation    = get_sub_field('prog_sub_location');
    $progsubabouttitle  = get_sub_field('prog_sub_abouttitle');
    $progsubabout       = get_sub_field('prog_sub_about');
    $progsubabouturl    = get_sub_field('prog_sub_abouturl');
    $counter = 1;

    ?>
    <!-- PROGRAM 1-->
    <div class="panel panel-default">

        <!-- Program Heading -->
        <div class="panel-heading" role="tab" id="heading1">

            <div class="row">
                <div class="col-lg-1 col-md-1 col-sm-1">
                    <p class="date"><?php echo $progtime; ?></p>
                </div>

                <div class="col-lg-11 col-md-11 col-sm-11">

                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#Program<?php echo $counter; ?>" aria-expanded="true" aria-controls="Program1">
                            <?php echo $progtitle; ?>
                        </a>
                    </h4>
                </div>
            </div>

        </div>

        <div id="Program<?php echo $counter; ?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading1">
            <!-- Program Content -->
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-2 col-md-2 col-sm-2">
                        <img class="img-responsive img-circle" src="<?php echo $progimage; ?>" alt="">
                    </div>

                    <div class="col-lg-7 col-md-7 col-sm-10">
                        <p class="speaker-name uppercase"><?php echo $progsubspeaker; ?></p>
                            <h4><?php echo $progtitle; ?></h4>
                                <p><?php echo $progsubdescription; ?></p>

                                <p><i class="fa fa-lg fa-clock-o"></i><span class="small"><?php echo $progsubduration; ?></span></p>
                                <p><i class="fa fa-lg fa-map-marker"></i> <span class="small"><?php echo $progsublocation; ?></span></p>
                            </div>

                            <div class="col-lg-3 col-md-3 col-sm-10">
                                <h5><?php echo $progsubabouttitle; ?></h5>
                                <p class="small"><?php echo $progsubabout; ?></p>
                                <span class="about-speaker"><i class="fa fa-lg fa-globe"></i> <a class="small" href="#"><?php echo  $progsubabouturl; ?></a></span>
                            </div>

                        </div>
                    </div>

                </div>

            </div>
            <?php $counter++; ?>
        <?php endwhile; ?> 

Answer 1

Got it. I used this source on stackoverflow as the solution.

I had to define $counter before the loop and add $counter++ in the loop, so each time the loop loops it would add +1.

Answer 2

Your problem is that $counter is defined as 1 within the loop, so everytime it runs it's setting it back to equal 1.

Move $counter = 1 above the while statement and this should work for you!