Home › Forums › Add-ons › Flexible Content Field › Create a global counter for a layout type
I have a repeater (called section) with a nested flexible content type. The flexible content has a number of different layout types but the one I need to assign a global counter to is the type called accordion. I need to give each instance of this layout type an ID. Because this ID sits within repeater, my attempts have resulted in the counter for my layout type resetting every time a new section is created. How do I stop this from happening?
For some context the reason I am doing this is because each accordion that is created, needs a separate jQuery call, with each call looking like:
$("#accordion-1").navgoco({accordion: true});
So if there were a total of 5 accordions on the page my PHP would generate the following jQuery:
$("#accordion-1").navgoco({accordion: true});
$("#accordion-2").navgoco({accordion: true});
$("#accordion-3").navgoco({accordion: true});
$("#accordion-4").navgoco({accordion: true});
$("#accordion-5").navgoco({accordion: true});
Here’s my flexible layout type (other layout types stripped for brevity) within a repeater found in index.php:
<?php if(get_field('section')): ?>
<?php $i = 1; while(has_sub_field('section')): ?>
<div class="inner" id="section-<?php echo $i ?>">
<?php if( get_sub_field('layout') ): ?>
<?php while( has_sub_field("layout") ): ?>
<?php if(get_row_layout() == "accordion"): ?>
<?php if( get_sub_field('accordion_item') ): ?>
<ul class="accordion" id=""> <!-- THIS IS THE LINE I NEED TO ASSIGN ID BUT COUNTER STARTS FROM 1 EVERY TIME A NEW SECTION IS ADDED - NO GOOD-->
<?php while( has_sub_field('accordion_item') ): ?>
<li><a href="#" class="menu-item ico"><?php the_sub_field('item_title'); ?></a>
<ul>
<li><?php the_sub_field('item_description'); ?></li>
</ul>
</li>
<?php endwhile; ?>
</ul>
<?php endif; ?>
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
</div>
<?php $i++; endwhile; ?>
<?php endif; ?>
All I really need to do is add a global counter to ONLY the accordion layout type so that each accordion is assigned a number. That way my footer loop can correlate.
I’m just not sure how to do this because my layout loop is within nested loops.
Hi @egr103
All you need to do is make a new counter for your flexible content field the same way you did for the repeater like so:
<?php $j = 0; if( get_sub_field('layout') ): ?>
<?php while( has_sub_field("layout") ): $j++; ?>
Then use $j in your div id like you used $i.
Thanks
E
Thanks @Elliot. I have done this but there are two things that do not work here.
id="ac-3"
id="ac-8"
id="ac-3"
id="ac-6"
id="ac-5"
The second bullet point isn’t a problem if the second counter in my footer.php file can just get all ID’s (no matter what they are) for the accordion layout type and generate a line of JS to match but I don’t know if this is possible. I only know of the way to do this sort of thing with a counter.
Hi @egr103
Thanks for the info.
Yes, all you need to do is move the $j = 0;
up a few lines and next to your $i = 1;
This means it is only reset once per page!
As for your code, you don’t even need to use ID’s realy, you could just use jQuery to find all ‘.accordion’ and run the jQuery plugin like so:
$('.accordion').each(function(){
$(this).navgoco({accordion: true});
});
Hope that helps.
Thanks
E
Sweet, I’m no developer pro but that jQuery code did the trick! I don’t exactly know how it resolved the conflicts I was having but its working now!
Thanks (again) Elliot! 1st rate support as always!
The topic ‘Create a global counter for a layout type’ is closed to new replies.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Privacy Policy. If you continue to use this site, you consent to our use of cookies.