I have a form which generates an HTML table using a PHP script on submission.
If the table looks like this…
Qty | Colour | Size | Name
----------------------------------
10 | Red | Small | Name 1
5 | Red | Small | Name 2
25 | White | Large | Name 3
…I’d like it to give information like this:
15 Red Small
25 White Large
Is this even possible as it stands using some clever PHP method I’m yet to learn? If not, and I were to use a database, would it be possible? I’d like to avoid using a database if at all possible as I don’t have database capabilities on the site it needs to be deployed on but could put it on another domain if need be.
Apologies for the lack of research effort on this one, I’m not sure where to start.
— edit to add code —
HTML
<form action="processform.php" method="post" id="monogramming-builder">
<fieldset>
<table>
<tr>
<th>Qty</th>
<th>Colour</th>
<th>Size</th>
<th>Name</th>
</tr>
<tr>
<td><input type="text" name="qty[]" class="qty" /></td>
<td>
<select name="colour[]">
<option value="">[Please Select]</option>
<option value="Red">Red</option>
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</td>
<td>
<select name="size[]">
<option value="">[Please Select]</option>
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="XL">XL</option>
<option value="2XL">2XL</option>
</select>
</td>
<td><input type="text" name="name[]" maxlength="18" /></td>
</tr>
</table>
<p><a href="javascript:;" class="addrow">Add a row</a></p>
<input type="submit" value="Send Request" />
</fieldset>
</form>
PHP:
$qtys = $_POST['qty'];
$colours = $_POST['colour'];
$sizes = $_POST['size'];
$names = $_POST['name'];
$output = '<h2>You have requested:</h2>' . "\n";
$output .= '<table><tr><th>Qty</th><th>Colour</th><th>Size</th><th>Name</th></tr>' . "\n";
for($i=0, $count = count($qtys); $i < $count; $i++) {
$output .= '<tr>';
$output .= '<td>' . $qtys[$i] . '</td>' . "\n";
$output .= '<td>' . $colours[$i] . '</td>' . "\n";
$output .= '<td>' . $sizes[$i] . '</td>' . "\n";
$output .= '<td>' . $names[$i] . '</td>' . "\n";
$output .= '</tr>' . "\n";
}
$output .= '</table>';
echo $output;
JS
$('.addrow').click(function(){
var tablerow = '<tr><td><input type="text" name="qty[]" class="qty" /></td><td><select name="colour[]"><option value="">[Please Select]</option><option value="Red">Red</option><option value="Black">Black</option><option value="White">White</option></select></td><td><select name="size[]"><option value="">[Please Select]</option><option value="Small">Small</option><option value="Medium">Medium</option><option value="Large">Large</option><option value="XL">XL</option><option value="2XL">2XL</option></select></td><td><input type="text" name="name[]" maxlength="18" /></td></tr>';
$('tr:last-child').after(tablerow);
});
I think this code or something very similar will do what you want:
What we do is while you’re looping over the post data to build the first table, we’re building a multi-dimensional array that looks like this:
Then we loop over that array and build another table to display it.