• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

I Like Kill Nerds

The blog of Australian Front End / Aurelia Javascript Developer & brewing aficionado Dwayne Charrington // Aurelia.io Core Team member.

  • Home
  • Aurelia 2
  • Aurelia 1
  • About
  • Aurelia 2 Consulting/Freelance Work

Wrapping Items Every X Iterations in PHP (without using counters or the modulus operator)

General · August 13, 2014

Recently whilst working on the reskin of a mammoth web application written in PHP, I encountered a scenario where I needed to wrap elements within a div every four iterations.

The task is simple enough and if you’ve worked with WordPress before especially, you’ll know the aged-old approach is to use a counter and then the modulus operator.

While the modulus and counter approach does work, it is hacky, complicated and messy. You’re probably wondering if there is a better way and there this.

Say hello to “array_chunk”

The array_chunk method in PHP is a very underrated function. It does what it says on the tin, it splits arrays into chunks. If an array has 40 items in it and we want to split it up into smaller chunks of say 10, we would have four arrays within an array adding up to 40.

Surprisingly, when I tell people about my use of array_chunk (which I’ve been using for a very long time) they are surprised and impressed. Most developers out there are still using the modulus operator like it is their only choice, this is why I have decided to write a blog post to make more people aware of array_chunk.

Wrap every four elements in a DIV (or any number)

<?php

	foreach (array_chunk($items, 4, TRUE) AS $chunks) {

		echo '<div class="wrapper">';

			foreach ($chunks AS $item) {
				echo '<div class="item">';
					echo '<h2>'.$item->name.'</h2>';
				echo '</div>';
			}

		echo '</div>';

	}

?>

Dwayne

Leave a Reply Cancel reply

2 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Jay
Jay
7 years ago

This solution worked best for me. Thanks!

0
Manus
Manus
7 years ago

Thank you, this was a very clear and helpful explanation!

0

Primary Sidebar

Popular

  • Testing Event Listeners In Jest (Without Using A Library)
  • How To Get The Hash of A File In Node.js
  • Thoughts on the Flipper Zero
  • Waiting for an Element to Exist With JavaScript
  • How To Paginate An Array In Javascript
  • Handling Errors with the Fetch API
  • How To Get Last 4 Digits of A Credit Card Number in Javascript
  • ChatGPT Stopping Part Way Through a Response? Here Is How You Fix It
  • How to Use Neural DSP Archetype Plugins With the Quad Cortex
  • How To Mock uuid In Jest

Recent Comments

  • CJ on Microsoft Modern Wireless Headset Review
  • Dwayne on Microsoft Modern Wireless Headset Review
  • CJ on Microsoft Modern Wireless Headset Review
  • john on Microsoft Modern Wireless Headset Review
  • Dwayne on Why You Should Be Using globalThis Instead of Window In Your Javascript Code

Copyright © 2023 · Dwayne Charrington · Log in

wpDiscuz