More efficient way to build dynamic menu - php

Question

I am creating a dynamic menu whos items appear depending on a set 'mode' (that is passed via ajax). Off this it creates the menu, disabling and hiding icons that are not associated with that mode.
The problem is, in my implementation there are a lot of if conditions. Can anyone show me a cleaner way of doing what I am trying to achieve?
My code is:
public function gridMenu()
{
$mode = Validate::sanitize($_POST['mode']);
$modes = array(
'products' => array('edit', 'delete', 'archive')
);
$output = '<div id="hexContainer">';
for($i = 1; $i < 7; $i++) {
$img = '';
$output .= '<div class="hex hex' . $i;
if($i == 1)
{
if(in_array('edit', $modes[$mode]))
{
$output .= ' hex-selectable';
$img = '<img data-option="Edit" src="' . ROOT . 'images/edit.png">';
} else {
$output .= ' hex-disabled';
}
}
if($i == 2)
{
if(in_array('zzz', $modes[$mode]))
{
$output .= ' hex-selectable';
} else {
$output .= ' hex-disabled';
}
}
if($i == 3)
{
if(in_array('delete', $modes[$mode]))
{
$output .= ' hex-selectable';
$img = '<img data-option="Delete" src="' . ROOT . 'images/delete.png">';
} else {
$output .= ' hex-disabled';
}
}
if($i == 4)
{
if(in_array('xxx', $modes[$mode]))
{
$output .= ' hex-selectable';
} else {
$output .= ' hex-disabled';
}
}
if($i == 5)
{
if(in_array('archive', $modes[$mode]))
{
$output .= ' hex-selectable';
$img = '<img data-option="Archive" src="' . ROOT . 'images/archive.png">';
} else {
$output .= ' hex-disabled';
}
}
if($i == 6)
{
if(in_array('zzz', $modes[$mode]))
{
$output .= ' hex-selectable';
} else {
$output .= ' hex-disabled';
}
}
$output .= '">';
$output .= $img;
$output .= '</div>';
}
$output .= '<div class="hex hex-mid"></div>';
$output .= '</div>';
echo $output;
}

Answer 1

Use the switch function:
switch ($i){
case 1:
//code for $i==1
break;
case 2:
// code for $i==2
break;
//...
}

Answer 2

This hasn't been tested, but you could try something along the lines of this.
Basically from your code I'm assuming that you're trying to insert an image only on the odd rounds. So with that I created a $_modes and $_mode variables which will hold the values for each round.
With these values, we will automatically create the HTML classes using the rules you have set in your code, and on each round if it's odd, and in the array then we also add the image.
public function gridMenu() {
$mode = Validate::sanitize($_POST['mode']);
$modes = array(
'products' => array('edit', 'delete', 'archive')
);
$_modes = array(
false,
array('Edit', 'edit'),
array('ZZZ', 'zzz'),
array('Delete', 'delete'),
array('XXX', 'xxx'),
array('Archive', 'archive'),
array('ZZZ', 'zzz'),
);
$output = '<div id="hexContainer">';
for($i = 1; $i < 7; $i++) {
$_mode = $_modes[$i];
$img = '';
$classnames = array('hex', 'hex' . $i);
if ( ($i % 2) === 0 && in_array($_mode[1], $modes[$mode])) {
$img = '<img data-option="' . $_mode[0] . '" src="' . ROOT . 'images/' . $_mode[1] . '.png">';
}
$classnames[] = (in_array($_mode[1], $modes[$mode]) ? 'hex-selectable' : 'hex-disabled');
$output .= '<div class="' . implode(' ', $classnames) . '">';
$output .= $img;
$output .= '</div>';
}
$output .= '<div class="hex hex-mid"></div>';
$output .= '</div>';
echo $output;
}