Home/ Questions/Q 7059281
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T04:12:48+00:00

Ok… First off, I know this isn’t a new question. But, for some reason

  • 0

Ok… First off, I know this isn’t a new question.
But, for some reason none of the suggestions Google has found for me (dating back to the begining of time even) are working. So, please bear with me.

Let’s say, I have a script structured something like this:

<?php
   try {
      print "<table><form id='menu' action='index.php' method='POST'><tr>";
      print "<td>Select A Fruit</td><td><select name=fruit>
         <option value=''></option>
         <option value='apple'>Apple</option>
         <option value='orange'>Orange</option>
         <option value='pear'>Pear</option></select></td></tr>";
      print "<tr><td><input type='submit' name='submit' value='Submit'></td></tr></form></table>";

      if (isset($_POST['submit'])){
         if (!empty($_POST['fruit'])){
            //Do whatever the form is supposed to trigger.
         }
         else {
           //Nothing selected; handle however makes sense.
         }
      }
   } 
   catch(Exception $e) {die( print_r( $e->getMessage() ) );}
?>

And instead of using the button, I want it to submit the form as soon as an option is selected.

Based on my searches, the textbook answer appears to be to modify the Select tag with an onchange attribute calling a JavaScript method like so:

<select name='fruit' onchange='document.getElementById('menu').submit()'>

or the short form:

<select name='fruit' onchange='this.form.submit()'>

But here is where I’m stuck…
None of the posts I found explain where you tell the browser/interpreter to drop out to JavaScript to make that work. So, this change does nothing for me.

What am I missing here?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I would get away from the dom level 0 handler and set the select’s onchange handler to a function that grabs your form, and calls submit on it.

    document.getElementById("yourSelectId").onchange = function() {
    document.forms["formsId"].submit();
};

    I’m showing you a more robust way of adding event handlers to dom elements. Instead of saying onchange="blah()" you can set up a body onload function that’ll run when your dom is ready, then you can use JavaScript to add your handlers: 

    <body onload="init()">

function init() {  
    document.getElementById("yourSelectId").onchange = function() {
        document.forms["formsId"].submit();
    };
}

    Or, you can skit the ugly <body onload="init()"> altogether and just put the code

        document.getElementById("yourSelectId").onchange = function() {
        document.forms["formsId"].submit();
    };

    in a regular script block at the bottom of your body

    • 0