title: Calling Javascript from a html form
body: <p>I am basing my question and example on Jason's answer in <a href="https://stackoverflow.com/questions/662630/javascript-form-bypassing-default-behaviour-for-ajax/664938#664938">this</a> question</p>
  
  <p>I am trying to avoid using an <code>eventListener</code>, and just to call <code>handleClick</code> <code>onsubmit</code>, when the submit button is clicked.</p>
  
  <p>Absolutely nothing happens with the code I have.</p>
  
  <p>Why is <code>handleClick</code> not being called?</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;script type="text/javascript"&gt;
        function getRadioButtonValue(rbutton)
        {
          for (var i = 0; i &lt; rbutton.length; ++i)
          { 
            if (rbutton[i].checked)
              return rbutton[i].value;
          }
          return null;
        }
  
        function handleClick(event)
        {
          alert("Favorite weird creature: "+getRadioButtonValue(this["whichThing"]));
          event.preventDefault(); // disable normal form submit behavior
          return false; // prevent further bubbling of event
        }
      &lt;/script&gt;
    &lt;/head&gt;
  &lt;body&gt;
      &lt;form name="myform" onSubmit="JavaScript:handleClick()"&gt;
        &lt;input name="Submit"  type="submit" value="Update" onClick="JavaScript:handleClick()"/&gt;
        Which of the following do you like best?
        &lt;p&gt;&lt;input type="radio" name="whichThing" value="slithy toves" /&gt;Slithy toves&lt;/p&gt;
        &lt;p&gt;&lt;input type="radio" name="whichThing" value="borogoves" /&gt;Borogoves&lt;/p&gt;
        &lt;p&gt;&lt;input type="radio" name="whichThing" value="mome raths" /&gt;Mome raths&lt;/p&gt;
      &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>edit:</p>
  
  <p>Please do not suggest a framework as a solution.</p>
  
  <p>Here are the relevant changes I have made to the code, which results in the same behavior.</p>
  
  <pre><code>      function handleClick()
        {
          alert("Favorite weird creature: "+getRadioButtonValue(document.myform['whichThing'])));
          event.preventDefault(); // disable normal form submit behavior
          return false; // prevent further bubbling of event
        }
      &lt;/script&gt;
    &lt;/head&gt;
  &lt;body&gt;
  &lt;form name="aye"&gt;;
        &lt;input name="Submit"  type="submit" value="Update" action="JavaScript:handleClick()"/&gt;
        Which of the following do you like best?
        &lt;p&gt;&lt;input type="radio" name="whichThing" value="slithy toves" /&gt;Slithy toves&lt;/p&gt;
        &lt;p&gt;&lt;input type="radio" name="whichThing" value="borogoves" /&gt;Borogoves&lt;/p&gt;
        &lt;p&gt;&lt;input type="radio" name="whichThing" value="mome raths" /&gt;Mome raths&lt;/p&gt;
      &lt;/form&gt;
  </code></pre>