CODEWITHSUNDEEP
phpmagento
Michael
Michael

Reputation: 499

How to divide categories in rows of three columns

I have a foreach loop which retrieves the subcategories of the current category.

<?php $_categories = $this->getCurrentChildCategories(); ?>
<?php foreach ($_categories as $_category): ?>
<div class="item">
    <a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>"><?php echo $this->htmlEscape($_category->getName()) ?></a>
</div>
<?php endforeach; ?>

I want to divide the results in rows of three columns. The desired format is then:

<div class="row">
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
</div>
<div class="row">
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
</div>
...

---------------EDIT----------------

My code is now as follows. How and where do i close the row div?

<?php $_categories = $this->getCurrentChildCategories(); ?>
<?php foreach ($_categories as $_category): ?>
<?php if ($i % 3 == 0) { ?>
<div class="row">
<?php } ?>
<div class="item">
    <h2><a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>"><?php echo $this->htmlEscape($_category->getName()) ?> &raquo;</a></h2>
</div>
<?php $i++; endforeach; ?>

---------------EDIT 2----------------

Getting closer. This is the result:

<div class="category-list">
    <div class="row"></div>
<div class="row">
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
</div>
<div class="row">
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
</div>
<div class="row">
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
    <div class="item">
        content
    </div>
</div>
</div>

How do I get rid of the empty row?

The code is now as follows:

<div class="category-list">

<?php
$i=0;
echo '<div class="row">';
$_categories = $this->getCurrentChildCategories();
foreach($_categories as $_category):
{
if($i %3 ==0)
  { ?>
     </div>
     <div class="row">
        <div class="item">
            <h2><a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>"><?php echo $this->htmlEscape($_category->getName()) ?> &raquo;</a></h2>
        </div>
  <? }
  else
  { ?>
        <div class="item">
            <h2><a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>"><?php echo $this->htmlEscape($_category->getName()) ?> &raquo;</a></h2>
        </div> 
  <? }
  $i++;
}
endforeach;
?>

</div>

---------------EDIT 3----------------

Solved by hiding the empty row via CSS.

Upvotes: 0

Views: 2837

Answers (2)

Naveen Kumar
Naveen Kumar

Reputation: 4601

Hope this helps

<?php
$i=0;
echo"<div class="row" >
foreach($category as $cat)
{
if($i %3 ==0)
  {
     echo"</div><div class='row'> <div class='item'> Content </div>";  
  }
  else
  {
    echo"<div class='item'> Content </div>";  
  }
  $i++;
}
echo"</div>";
?>

Upvotes: 1

Peter Kiss
Peter Kiss

Reputation: 9329

You have to introduce az iterator (?) variable for example $i = 0

if ($i % 3 == 0) { //modulo
   // use for whatever you want
}

In every cycle (maybe at the end of it, it depends on your real solution) you have to increment $i (++$i);

Upvotes: 2

Related Questions