New issue
Advanced search Search tips

Issue 912892 link

Starred by 3 users

Issue metadata

Status: WontFix
Owner:
Closed: Dec 10
Components:
EstimatedDays: ----
NextAction: 2018-12-21
OS: Mac
Pri: 2
Type: Bug



Sign in to add a comment

Chrome not submitting form data when clicking <button type="submit"> including <label>

Reported by teja...@practo.com, Dec 7

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36

Steps to reproduce the problem:
1. Create a html form with data
2. For submit use <button type="submit" > instead of <input type="submit"> element
3. Click on the button to submit form

What is the expected behavior?
form should be submitted.

What went wrong?
Form is not submitted.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 70.0.3538.110  Channel: n/a
OS Version: OS X 10.13.6
Flash Version:
 
Screen Shot 2018-12-07 at 5.26.19 PM.png
574 KB View Download

Comment 1 Deleted

Labels: Needs-Feedback
NextAction: 2018-12-21
Reporter, please provide a reproducible HTML.

<!DOCTYPE html>
<html>
<head>
<title>
test
</title>
</head>
<body>
<script type="text/javascript">
submitForm1 = function(){
document.getElementById('form1').submit();
}
</script>
<form action="http://example.org/" id = 'form1' method="POST">
<input type="text" name="sdf">
<button type="submit"  name="dsfads" >
<label>
adesh
</label>
</button>
</form>
</body>
</html>

use this html
click on button won't work click on side button will work.
Project Member

Comment 4 by sheriffbot@chromium.org, Dec 7

Cc: tkent@chromium.org
Labels: -Needs-Feedback
Thank you for providing more feedback. Adding the requester to the cc list.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Components: -Blink>Forms Blink>Forms>Label
Status: Untriaged (was: Unconfirmed)
Wow, <label> inside <button> is very tricky.
Clicking 'adesh' actually clicks the <label>, and the <label> is associated to nothing.  I'll investigate what the standard says in such case.


<!DOCTYPE html>
<html>
<head>
<title>
 test
</title>
</head>
<body>
<form action="http://example.org/" id = 'form1' method="POST">
<input type="text" name="sdf">
<button type="submit" name="dsfads" > 
<label>
Click Me
</label>
</button>
</form>
</body>
</html>

Use above html & click in the middle of button . Won't work. Now click at edge of button will work.
At tkent@chromium.org, please note that it works correctly in Firefox.
Cc: -tkent@chromium.org
Owner: tkent@chromium.org
Status: WontFix (was: Untriaged)
Summary: Chrome not submitting form data when clicking <button type="submit"> including <label> (was: Chrome not submitting form data when button with type="submit" is used. )
Well, I investigated DOM and HTML standards, and my conclusion is this is a bug of Firefox.

- The submit button has an activation behavior.  https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type-submit-state

- The label element has an activation behavior.  https://html.spec.whatwg.org/multipage/forms.html#the-label-element:activation-behaviour

- DOM standards say dispatching a 'click' event choses a single activationTarget.  https://dom.spec.whatwg.org/#concept-event-dispatch
  In this case, it's the <label>.
  So, the activation behavior of the submit button should not be triggered.

Interestingly, Edge diverged from Internet Explorer (which behaved like Chrome).
The NextAction date has arrived: 2018-12-21

Sign in to add a comment