I have a dropdown menu with a PHP \'foreach\' that I loop through to populate the select options. This works well. However, what I\'d like to do is have various sub labels u
Try
<select name="backgroundList" id="backgroundList">
<?php
$album_type = '';
foreach ($albums as $album) {
if ($album_type != $album['type']) {
if ($album_type != '') {
echo '</optgroup>';
}
echo '<optgroup label="'.ucfirst($album['type']).' Backgrounds">';
}
echo '<option value="'.$album['id'].'">'.htmlspecialchars($album['title']).'</option>';
$album_type = $album['type'];
}
if ($album_type != '') {
echo '</optgroup>';
}
?>
</select>
This method does not require sorting the array
<select>
<?php
<!-- getting the groups to be one unique array -->
$group= array_values(array_unique(array_column($album, 'type')));
for ($i=0; $i < count($group); $i++) : ?>
<!-- for N group print -->
<optgroup label="<?=$album[$i];?>">
<!-- loop trough the hole array to check if you belong to the group -->
<?php foreach ($album as $value): ?>
<!-- if you belong then we print -->
<?php if ($group_level[$i]==$value['type']): ?>
<option>
<?=$value['type'];?>
</option>
<?php endif ?>
<?php endforeach ?>
</optgroup>
<?php endfor ?>
</select>
Check if the type changed from the previous value, and then emit the appropriate tags.
Order the query by type:
$query = mysql_query("SELECT * FROM background_albums order by type"); //ordered query
[...]
$type = null;
foreach ($albums as $album) {
if ($album['type'] != $type) { // type changed
if ($type !== null) {
echo '</optgroup>'; // close previous optgroup
}
$type = $album['type'];
echo '<optgroup label="' . htmlspecialchars($type) . '">'; // start optgroup
}
[...]
}
echo '</optgroup>'; // close last optgroup
After searching for loads of various posts online...then a great deal of trial and error, I finally found an optgroup solution that worked great.
This code is fairly similar to tagrin0, but I thought I'd provide this with a bit more comments to help the other noobs that might be wanting a clear picture of how to make this work without much fudging and interpretation with the code.
Hope it helps someone.
Here's the table structure...
opt_id | grp_id | optName | grpName | optAbbrv...
echo '<select id="xxx" class="xxx"> select">';
echo '<option >Select an instance...</option>';
$dbc = mysqli_connect('localhost','xxx','xxx','xxx') or die('Error connecting to MySQL server.');
// run your query, something like
// "SELECT <optgroup>_ID, <option>_ID, <optgroup>_Name, <ption>_Name FROM [mysql table this data is stored in] ORDER BY groupID, optionID"
$select = "SELECT * FROM ci_opt ORDER BY grp_id, opt_id";
$data = @mysqli_query($dbc, $select) or die(mysql_error());
// <optgroup> of the previous <option>
$previous = "";
// variable to set the first group
$first_group = true;
while($row = mysqli_fetch_array($data)) {
// if this <option> changed <optgroup> from the previous one,
// then add a new <optgroup>
if ($row['grpName'] != $previous) {
if (!$first_group) {
echo '</optgroup>';
} else {
$first_group = false;
}
echo '<optgroup label="' . $row['grpName'] . '">';
$previous = $row['grpName'];
}
// echo the current <option>
// Note: I've also prepared the [onclick] for linking the select to an event
echo '<option id="'. $row['optAbbrv'] .'" onclick="javascript:void()">' . ucwords($row['optName']) . '</option>';
}
// close the last <optgroup> tag
echo '</optgroup>';
// close the last <select> tag
echo '</select>';
// close the connection
mysqli_close($dbc);
// end php