Echo html table from PHP array

Question

I'm learning php and I'm stuck with one task.. I have an array looking like this:

$data[1]["First"]   = "Iva";
$data[1]["Last"]    = "Ivić";
$data[1]["Date"]    = "2016-09-29";
$data[1]["Paid"]    = "Yes";

$data[2]["First"]   = "Petar";
$data[2]["Last"]    = "Perić";
$data[2]["Date"]    = "2016-02-08";
$data[2]["Paid"]    = "No";

$data[3]["First"]   = "Tomo";
$data[3]["Last"]    = "Tomić";
$data[3]["Date"]    = "2015-08-22";
$data[3]["Paid"]    = "Yes";

I need to echo HTML table from this Array. On the value ['Paid'], html table should output select field and showing current value as selected. Also, first column of the table should assign #ID number.

So far, I've managed to create the table, but I can't figure out how to count and echo # and getting the select field to work. Second value doesn't work for me.

<table border="1" align="center" width="80%">
<tr bgcolor="yellow">
    <th>ID #</th>
    <th>First</th>
    <th>Last</th>
    <th>Date</th>
    <th>Paid</th>
</tr>
<?php 

foreach ( $data as $info )
{
// date transform
$date = explode('-', $info['Date']);
//var_dump($date); 

echo '<tr align="center" bgcolor="#f6f6f6">';
echo ' <td>' '</td>';// How to count #IDs starting from 1?     
echo '<td>'. $info['First'] .'</td>';
echo '<td>'. $info['Last'] .'</td>';
echo '<td>'. $date[2].'.'.$date[1].'.'.$date[0].'.</td>';
//echo '<td>'. $info['Paid'] .'</td>';

echo '<td>';
echo '<select name="Paid">';
echo '<option value="0" selected>'. $info['Paid'] .'</option>';
echo '<option value="1">'. $info['Paid'] .'</option>';//This is where I'm stuck
echo '</select>';
echo '</td>';
echo '</tr>';
}
?>
</table>
?>

Thanks.

Answer 1

There are plenty of loops you can use to achieve this, the easiest case here is the foreach() loop.

<!-- conditional loops -->
<?php foreach($data as $single): ?>

    <!-- shorthand PHP statement to echo the result -->
    <td> <?= $single['First']; ?> </td>

<?php endforeach; ?>

Note - Array index's start at 0, not 1. So the first value would be $data[0]['First']

If you're creating tables for each array inside it, you can use nested loops like this:

<?php for($i = 0; $i <= count($data); $i++):
    foreach($data[$i] as $key => $val): ?>
        <td>
            <!-- ternary expression -->
            <tr> <?= ($key == "First") ? $val : ""; ?> </tr>
        </td>
    <?php endforeach;
endfor;

If you prefer a different approach, you can use while() loops to achieve the same idea:

<?php $i = 0;
while($i != count($data)): ?>
    <tr> <?= $data[$i++]['First']; ?> </tr>
<?php endwhile;

Note for future - It's a lot easier working with bool datatypes rather than 'yes', 'no' strings. For example:

$paid = true;
echo ($paid) ? 'selected' : '';

rather than something like:

echo ($paid == 'No') ? '' : 'selected';

Answer 2

With subtle adjustment to your code you can just check your paid value and if it matches your option add the selected attribute.

You can use the $data keys as ids.

<?php

$data[1]["First"]   = "Iva";
$data[1]["Last"]    = "Ivić";
$data[1]["Date"]    = "2016-09-29";
$data[1]["Paid"]    = "Yes";

$data[2]["First"]   = "Petar";
$data[2]["Last"]    = "Perić";
$data[2]["Date"]    = "2016-02-08";
$data[2]["Paid"]    = "No";

$data[3]["First"]   = "Tomo";
$data[3]["Last"]    = "Tomić";
$data[3]["Date"]    = "2015-08-22";
$data[3]["Paid"]    = "Yes";

?>
<table>
    <thead>
    <tr>
        <th>ID #</th>
        <th>First</th>
        <th>Last</th>
        <th>Date</th>
        <th>Paid</th>
    </tr>
</thead>
<tbody>
<?php 
foreach ( $data as $key => $info )
{
    $date = explode('-', $info['Date']);
    echo '<tr>';
        echo '<td>' . $key . '</td>';
        echo '<td>'. $info['First'] .'</td>';
        echo '<td>'. $info['Last'] .'</td>';
        echo '<td>'. $date[2].'.'.$date[1].'.'.$date[0].'.</td>';
        echo '<td>';
            echo '<select name="Paid">';
            $selected = $info['Paid'] == 'Yes' ? 'selected' : '';
            echo "<option value=0 $selected >Yes</option>";
            $selected = $info['Paid'] == 'No' ? 'selected' : '';
            echo "<option value=1 $selected >No</option>";
            echo '</select>';
        echo '</td>';
    echo '</tr>';
}
?>
</table>

I'd probably use Yes and No as the values for options or 1 and 0 respectively, or just use a checkbox. But each to their own.

Answer 3

The first entry in an array is the zeroth entry. So if you declare the array, do it like this:

$data = [
   [ // 0
      "First" => "Iva",
      "Last" => "Ivic",
      "Date" => "2016-09-26",
      "Paid" => "Yes",
   ], 
   [ // 1
      // etc.
   ],
];

Next, if you want the indexes in the foreach loop, you should do this:

foreach($data as $index => $info){
    // $index will now be 0 in the first iteration, 1 in the second etc.
    echo "<td>#" . ($index + 1) . "</td>";
}