Generating multiple columns from a dynamically generated list in PHP

Question

I have a script that generates the UL LI statements, and creates a single column list, now I need to modify that so instead of a long list, I divide it in several columns, each with 10 elements until the end.

    for ($i=0;$i<sizeof($manufacturer_sidebox_array);$i++) {

  $content = '';
  $content .= '<li ><a class="hide" href="' . zen_href_link(FILENAME_DEFAULT,   'manufacturers_id=' . $manufacturer_sidebox_array[$i]['id']) . '">';
  $content .= $manufacturer_sidebox_array[$i]['text'];
  $content .= '</a></li>' . "\n";
  echo $content;
}

What I am trying to figure out is how to insert some if statements in a way I can create the columns.

Right now the output is:

Col1

first second third fourth fifth sixth . . . twentieth

What I want is:

Col1 Col2 Col3 ... Col6

first 11th 21th nth . . . 10th 20th 30th

And you want these columns stacked next to each other vertically, and all part of the same HTML list? — larsAnders, Mar 31 '14 at 17:10
Hey there. I posted an answer for you below. Check it out, let me know your thoughts. — larsAnders, Mar 31 '14 at 19:56

larsAnders · Answer 1 · 2014-03-31T21:34:46.040

0

This will break the array into groups of ten, wrapping each group in a column div. Notice that we begin the first div before the loop and end the last div after the loop. The crucial piece to break at 10 entries is the modulus operator - % - you can read about it in the PHP documentation:

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

for ($i=0; $i<count($manufacturer_sidebox_array); $i++) {

    if ($i % 10 == 0){
        echo '</div><div class="menuColumn">';
    }

    $content = '';
    $content .= '<li ><a class="hide" href="' . zen_href_link(FILENAME_DEFAULT,   'manufacturers_id=' . $manufacturer_sidebox_array[$i]['id']) . '">';
    $content .= $manufacturer_sidebox_array[$i]['text'];
    $content .= '</a></li>' . "\n";
    echo $content;

}

echo '</div>';

You'll also need this CSS style to make the columns stack next to each other horizontally instead of the default vertical stacking. Obviously you can adjust the margin to suit your preferences:

<style>
.menuColumn{
    display:inline-block;
    margin:10px;
    vertical-align: text-top;
}
</style>

edited Mar 31 '14 at 21:34

answered Mar 31 '14 at 17:43

larsAnders

3,813
1
15
19

Thanks I will try that and let you know, I already have column classes but yours is much better .. ;) – Rick Fitzgerald Mar 31 '14 at 20:53
ok, I 've tried your solution and it worked ... partially because it messed up the whole site do you want me to post the whole css file and the php code, so you can take a look? It seems your additional div messed up the current divs. – Rick Fitzgerald Mar 31 '14 at 21:24
If you already had a column class, I would just change my new one to `echo '
';` and the CSS to `.menuColumn{` and leave your other styles intact. Is that what you did, or did you make a hybrid somehow?
– larsAnders Mar 31 '14 at 21:25
@RickFitzgerald Ok, good to hear. If you could accept my answer, that would be great. – larsAnders Apr 01 '14 at 13:34

Generating multiple columns from a dynamically generated list in PHP

1 Answers1