Note that there are some explanatory texts on larger screens.

plurals
  1. POHow is the default submit button on an HTML form determined?
    primarykey
    data
    text
    <p>If a form is submitted but not by any specific button, such as</p> <ul> <li>by pressing <kbd>Enter</kbd></li> <li>using <code>HTMLFormElement.submit()</code> in JS</li> </ul> <p>how is a browser supposed to determine which of multiple submit buttons, if any, to use as the one pressed?</p> <p>This is significant on two levels:</p> <ul> <li>calling an <code>onclick</code> event handler attached to a submit button</li> <li>the data sent back to the web server</li> </ul> <p>My experiments so far have shown that:</p> <ul> <li>when pressing <kbd>Enter</kbd>, Firefox, Opera and Safari use the first submit button in the form</li> <li>when pressing <kbd>Enter</kbd>, IE uses either the first submit button or none at all depending on conditions I haven't been able to figure out</li> <li>all these browsers use none at all for a JS submit</li> </ul> <p>What does the standard say?</p> <p>If it would help, here's my test code (the PHP is relevant only to my method of testing, not to my question itself)</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;title&gt;Test&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;h1&gt;Get&lt;/h1&gt; &lt;dl&gt; &lt;?php foreach ($_GET as $k =&gt; $v) echo "&lt;dt&gt;$k&lt;/dt&gt;&lt;dd&gt;$v&lt;/dd&gt;"; ?&gt; &lt;/dl&gt; &lt;h1&gt;Post&lt;/h1&gt; &lt;dl&gt; &lt;?php foreach ($_POST as $k =&gt; $v) echo "&lt;dt&gt;$k&lt;/dt&gt;&lt;dd&gt;$v&lt;/dd&gt;"; ?&gt; &lt;/dl&gt; &lt;form name="theForm" method="&lt;?php echo isset($_GET['method']) ? $_GET['method'] : 'get'; ?&gt;" action="&lt;?php echo $_SERVER['SCRIPT_NAME']; ?&gt;"&gt; &lt;input type="text" name="method" /&gt; &lt;input type="submit" name="action" value="Button 1" onclick="alert('Button 1'); return true" /&gt; &lt;input type="text" name="stuff" /&gt; &lt;input type="submit" name="action" value="Button 2" onclick="alert('Button 2'); return true" /&gt; &lt;input type="button" value="submit" onclick="document.theForm.submit();" /&gt; &lt;/form&gt; &lt;/body&gt;&lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload