This is a simple problem that I've been trying to solve for several hours. I have an array containing information of several students and marks they scored in tests. There are 8 subjects in total, with each subject having 5 parameters.
The array looks like below:
Array
(
[Ron] => Array
(
[subject1] => Array
(
[test1] => 47
[test2] => 86
[total] => 133
[percentage] => 88.67
[status] => Pass
)
[pass_count] => 8
[fail_count] => 0
[gross_total] => 963
[gross_percentage] => 80.25
[...]
[subject8] => Array
(
[test1] => 48
[test2] => 86
[total] => 134
[percentage] => 89.33
[status] => Pass
)
[pass_count] => 8
[fail_count] => 0
[gross_total] => 900
[gross_percentage] => 75.50
)
[John] => Array
(
[subject1] => Array
(
[test1] => 39
[test2] => 72
[total] => 111
[percentage] => 74
[status] => Pass
)
[pass_count] => 8
[fail_count] => 0
[gross_total] => 963
[gross_percentage] => 80.25
[...]
[subject8] => Array
(
[test1] => 39
[test2] => 75
[total] => 114
[percentage] => 76
[status] => Pass
)
[pass_count] => 8
[fail_count] => 0
[gross_total] => 846
[gross_percentage] => 70.5
)
)
I need to display the following in a nicely formatted HTML table (I'm planning to use Bootstrap), but I can't for the life of me figure out how to properly nest the table using PHP.
This is the HTML markup that I currently have: http://jsfiddle.net/9y910uvp/
This gives the following result:
Which is okay.
The Actual Problem
I'm using PHP to display the contents from the array. I'm confused how to display the values for the nested <tr>
and <td>
sections.
How do I loop through the array and display the contents correctly? (I'd post my attempts so far, but they're all stupid and not working so I'm not posting).
An example would be greatly appreciated because I've spent countless hours trying to get this working, but failed terribly.
Tables can be nested together to create a table inside a table. To create a nested table, we need to create a table using the <table> tag. This table is known as the outer table. The second table that will be nested table is called the inner table.
A nested data structure is an array or object which refers to other arrays or objects, i.e. its values are arrays or objects. Such structures can be accessed by consecutively applying dot or bracket notation. Here is an example: const data = { code: 42, items: [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }] };
Creating a Nested Array: This one is just equating the variable to the array. Second one is using the array method new Array() . And the last one is using the Array() which is similar to the new Array() . Note that all these methods yield the same result.
Nested Array in JavaScript is defined as Array (Outer array) within another array (inner array). An Array can have one or more inner Arrays. These nested array (inner arrays) are under the scope of outer array means we can access these inner array elements based on outer array object name.
Try this out
<table border="1">
<thead>
<thead>
<tr>
<th>Name</th>
<th>Subject</th>
<th>Test1 Marks</th>
<th>Test2 Marks</th>
<th>Total Marks</th>
<th>Status</th>
<th>Percentage</th>
<th>Pass Count</th>
<th>Total Percentage</th>
</tr>
</thead>
<tbody>
</tr>
<?php
$numberOfSubjects = 3; //I used 3 subjects. You should change this to 8 for your data.
foreach ($data as $student => $info) {
echo "<tr><td rowspan=$numberOfSubjects />$student</td>";
//flag to let the inner loop the tr has been drawn for the first row
$firstRow = true;
foreach ($info as $key => $value) {
//we only want subject info
if (strpos($key, "subject") === 0) {
if (!$firstRow) {
echo "<tr>";
} //else we already drew it
//its a subject so
echo "<td>$key</td>";
echo "<td>{$value['test1']}</td>";
echo "<td>{$value['test2']}</td>";
echo "<td>{$value['total']}</td>";
echo "<td>{$value['status']}</td>";
echo "<td>{$value['percentage']}</td>";
//only draw total for the first row
if ($firstRow) {
echo "<td rowspan=$numberOfSubjects>{$info['pass_count']}</td>";
echo "<td rowspan=$numberOfSubjects>{$info['gross_percentage']}</td>";
}
//close the row
echo "</tr>";
$firstRow = false;
}
}
}
?>
</tbody>
</table>
Here is the output:
Its based on a sample dataset I constructed from your description, included below for completeness:
<?php
$data = array(
"Ron" => Array
(
"subject1" => Array
(
"test1" => 47
, "test2" => 86
, "total" => 133
, "percentage" => 88.67
, "status" => Pass
)
, "pass_count" => 8
, "fail_count" => 0
, "gross_total" => 963
, "gross_percentage" => 80.25,
"subject2" => Array
(
"test1" => 47
, "test2" => 86
, "total" => 133
, "percentage" => 88.67
, "status" => Pass
)
, "subject3" => Array
(
"test1" => 48
, "test2" => 86
, "total" => 134
, "percentage" => 89.33
, "status" => Pass
)
, "pass_count" => 8
, "fail_count" => 0
, "gross_total" => 900
, "gross_percentage" => 75.50
),
"John" => Array
(
"subject1" => Array
(
"test1" => 47
, "test2" => 86
, "total" => 133
, "percentage" => 88.67
, "status" => Pass
)
, "pass_count" => 8
, "fail_count" => 0
, "gross_total" => 963
, "gross_percentage" => 80.25,
"subject2" => Array
(
"test1" => 47
, "test2" => 86
, "total" => 133
, "percentage" => 88.67
, "status" => Pass
)
, "subject3" => Array
(
"test1" => 48
, "test2" => 86
, "total" => 134
, "percentage" => 89.33
, "status" => Pass
)
, "pass_count" => 8
, "fail_count" => 0
, "gross_total" => 963
, "gross_percentage" => 80.25
)
);
Not quite the same output, but here's a recursive approach that should handle any depth of nested arrays...
<?php
$data = Array (
"Ron" => Array (
"subject1" => Array (
"tests" => Array (
"test1" => 47,
"test2" => 86,
"total" => 133,
"percentage" => 88.67,
"status" => "Pass",
),
"pass_count" => 8,
"fail_count" => 0,
"gross_total" => 963,
"gross_percentage" => 80.25,
),
"subject8" => Array (
"tests" => Array (
"test1" => 48,
"test2" => 86,
"total" => 134,
"percentage" => 89.33,
"status" => "Pass",
),
"pass_count" => 8,
"fail_count" => 0,
"gross_total" => 900,
"gross_percentage" => 75.50,
),
),
"John" => Array (
"subject1" => Array (
"tests" => Array (
"test1" => 39,
"test2" => 72,
"total" => 111,
"percentage" => 74,
"status" => "Pass",
),
"pass_count" => 8,
"fail_count" => 0,
"gross_total" => 963,
"gross_percentage" => 80.25,
),
"subject8" => Array (
"tests" => Array (
"test1" => 39,
"test2" => 75,
"total" => 114,
"percentage" => 76,
"status" => "Pass",
),
"pass_count" => 8,
"fail_count" => 0,
"gross_total" => 846,
"gross_percentage" => 70.5,
),
),
);
print_r($data);
$table = table_cell($data);
echo $table;
function table_cell($data) {
$return = "<table border='1'>";
foreach ($data as $key => $value) {
$return .= "<tr><td>$key</td><td>";
if (is_array($value)) {
$return .= table_cell($value);
} else {
$return .= $value;
}
$return .= "</td><tr>";
}
$return .= "</tr></table>";
return($return);
}
and the table looks nothing like the requested but... it was an interesting excersize...
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With