{"id":353,"date":"2012-05-10T16:16:09","date_gmt":"2012-05-10T16:16:09","guid":{"rendered":"https:\/\/ibex.tech\/cloud\/?p=353"},"modified":"2026-04-01T21:22:31","modified_gmt":"2026-04-01T20:22:31","slug":"select-box","status":"publish","type":"post","link":"https:\/\/ibex.tech\/cloud\/html\/forms-html\/select-box\/select-box","title":{"rendered":"Select Box"},"content":{"rendered":"\n<pre class=\"wp-block-code\"><code>&lt;select name=\"MySelectBox\" style=\"width: 300px;\">\n\t&lt;option value=\"0\" selected>Option 0&lt;\/option>\n\t&lt;option value=\"1\" >Option 1&lt;\/option>\n&lt;\/select><\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Causing Form To Submit OnChange <\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code> &lt;select name=\"MySelectBox\" onchange=\"this.form.submit()\"><\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Loading With Selected Setting From PHP  &#8211; Using an array<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">PHP<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  \/\/Create the select box values and select the currently selected value\n  $MySelectBoxValues = array(\n    1 => 'Current hour',\n    2 => 'Last 2 hours',\n    6 => 'Last 6 hours',\n    12 => 'Last 12 hours',\n    24 => 'Last 24 hours',\n    168 => 'Last 7 days',\n    744 => 'Last 31 days'\n  );\n  $MySelectBoxHtml = '';\n  foreach ($MySelectBoxValues as $Value => $Label)\n  {\n    $Selected = ($ViewStatsNumOfHours == $Value) ? ' selected' : '';\n    $MySelectBoxHtml .= \"&lt;option value=\\\"{$Value}\\\"{$Selected}>{$Label}&lt;\/option>\";\n  }<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">HTML<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  &lt;select name=\"MySelectBox\" style=\"width:300px;\" >\n    $MySelectBoxHtml\n  &lt;\/select><\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Auto submit select box form example<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">PHP<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  $MySelectBox = 24;\n  if (isset($_POST&#91;'my_form_submit_id']) &amp;&amp; ($_POST&#91;'my_form_submit_id'] == 'select_box_used'))\n  {\n    \/\/----- SELECT BOX USED -----\n    $MySelectBox = intval($_POST&#91;'MySelectBox']) ?? 24;\n\n    echo \"&#91;$MySelectBox]\";\n  }\n\n  \/\/Create the select box values and select the currently selected value\n  $MySelectBoxValues = array(\n    1 => 'Current hour',\n    2 => 'Last 2 hours',\n    6 => 'Last 6 hours',\n    12 => 'Last 12 hours',\n    24 => 'Last 24 hours',\n    168 => 'Last 7 days',\n    744 => 'Last 31 days'\n  );\n\n  $MySelectBoxHtml = '';\n  foreach ($MySelectBoxValues as $Value => $Label)\n  {\n    $Selected = ($MySelectBox == $Value) ? ' selected' : '';\n    $MySelectBoxHtml .= \"&lt;option value=\\\"{$Value}\\\"{$Selected}>{$Label}&lt;\/option>\";\n  }<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">HTML<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  &lt;form method=\"POST\">\n\n    &lt;input type=\"hidden\" name=\"my_form_submit_id\" value=\"select_box_used\" \/>\n\n    &lt;select name=\"MySelectBox\" style=\"width: 300px;\" onchange=\"this.form.submit()\" >\n      $MySelectBoxHtml\n    &lt;\/select>\n  &lt;\/form><\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Doing specific things<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">Get selected item text<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  &lt;select id=\"SelectCategory\" name=\"SelectCategory\" style=\"width:100%; max-width:400px\" onchange=\"javascript:PopulateCategoryType();\" &gt;\n    ...\n  &lt;\/select&gt;\n\n  &lt;script&gt;\n    function PopulateCategoryType() {\n      var e = document.getElementById('SelectCategory');\n      var result = e.options&#91;e.selectedIndex].text;\n      document.getElementById('ResourceCategoryType').value = result;\n    }\n    setTimeout(PopulateCategoryType(), 2500);\n  &lt;\/script&gt;<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Causing Form To Submit OnChange Loading With Selected Setting From PHP &#8211; Using an array PHP HTML Auto submit select box form example PHP HTML Doing specific things Get selected item text<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[383],"tags":[],"class_list":["post-353","post","type-post","status-publish","format-standard","hentry","category-select-box"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/353","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/comments?post=353"}],"version-history":[{"count":23,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/353\/revisions"}],"predecessor-version":[{"id":5329,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/353\/revisions\/5329"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/media?parent=353"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/categories?post=353"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/tags?post=353"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}