Create a global counter for a layout type

• egr103

• November 28, 2013 at 2:48 am

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; ?>

• egr103

• November 28, 2013 at 3:04 am

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.

• Elliot

• November 28, 2013 at 10:26 am

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

• egr103

• November 28, 2013 at 9:16 pm

Thanks @Elliot. I have done this but there are two things that do not work here.

• The counter resets every time a new section is created, meaning I get multiple ID’s that are the same, which creates conflicts
• The ID’s generated are based on the placement in their section meaning there might not be an ID with a value of 1 or 2 if for example an accordion isn’t the 1st/2nd item within the section. The resulting ID’s I get returned are the following:

  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.

• Elliot

• November 29, 2013 at 9:56 am

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

• egr103

• November 30, 2013 at 12:23 am

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!