<select name="MySelectBox" style="width: 300px;">
<option value="0" selected>Option 0</option>
<option value="1" >Option 1</option>
</select>
Causing Form To Submit OnChange
<select name="MySelectBox" onchange="this.form.submit()">
Loading With Selected Setting From PHP – Using an array
PHP
//Create the select box values and select the currently selected value
$MySelectBoxValues = array(
1 => 'Current hour',
2 => 'Last 2 hours',
6 => 'Last 6 hours',
12 => 'Last 12 hours',
24 => 'Last 24 hours',
168 => 'Last 7 days',
744 => 'Last 31 days'
);
$MySelectBoxHtml = '';
foreach ($MySelectBoxValues as $Value => $Label)
{
$Selected = ($ViewStatsNumOfHours == $Value) ? ' selected' : '';
$MySelectBoxHtml .= "<option value=\"{$Value}\"{$Selected}>{$Label}</option>";
}
HTML
<select name="MySelectBox" style="width:300px;" >
$MySelectBoxHtml
</select>
Auto submit select box form example
PHP
$MySelectBox = 24;
if (isset($_POST['my_form_submit_id']) && ($_POST['my_form_submit_id'] == 'select_box_used'))
{
//----- SELECT BOX USED -----
$MySelectBox = intval($_POST['MySelectBox']) ?? 24;
echo "[$MySelectBox]";
}
//Create the select box values and select the currently selected value
$MySelectBoxValues = array(
1 => 'Current hour',
2 => 'Last 2 hours',
6 => 'Last 6 hours',
12 => 'Last 12 hours',
24 => 'Last 24 hours',
168 => 'Last 7 days',
744 => 'Last 31 days'
);
$MySelectBoxHtml = '';
foreach ($MySelectBoxValues as $Value => $Label)
{
$Selected = ($MySelectBox == $Value) ? ' selected' : '';
$MySelectBoxHtml .= "<option value=\"{$Value}\"{$Selected}>{$Label}</option>";
}
HTML
<form method="POST">
<input type="hidden" name="my_form_submit_id" value="select_box_used" />
<select name="MySelectBox" style="width: 300px;" onchange="this.form.submit()" >
$MySelectBoxHtml
</select>
</form>
Doing specific things
Get selected item text
<select id="SelectCategory" name="SelectCategory" style="width:100%; max-width:400px" onchange="javascript:PopulateCategoryType();" >
...
</select>
<script>
function PopulateCategoryType() {
var e = document.getElementById('SelectCategory');
var result = e.options[e.selectedIndex].text;
document.getElementById('ResourceCategoryType').value = result;
}
setTimeout(PopulateCategoryType(), 2500);
</script>
