Opened 11 years ago

Closed 9 years ago

Last modified 8 years ago

#6880 closed defect (duplicate)

Button: clicking on edges of button won't submit form

Reported by: bill Owned by: Douglas Hays
Priority: low Milestone: future
Component: Dijit - Form Version: 1.1.1
Keywords: Cc:
Blocked By: Blocking:

Description

The Button template allows for various button styling, such as noir's rounded corner buttons (see templateThemeTest.html from 1.0.2.

However, clicking on the edges of the button (which is inside of Button.domNode but not part of the <button> node itself), although it will fire the onClick handler, it won't actually submit the form.

See attached testcase.

Not sure what (if anything) can be done about this but filing ticket for reference for now.

Attachments (1)

wide.html (1.2 KB) - added by bill 11 years ago.
put in dijit/tests/form directory

Download all attachments as: .zip

Change History (8)

Changed 11 years ago by bill

Attachment: wide.html added

put in dijit/tests/form directory

comment:1 Changed 11 years ago by Douglas Hays

Milestone: 2.0
Priority: normallow
severity: normalminor

comment:2 Changed 11 years ago by Douglas Hays

Milestone: 2.0future

I don't think this can be fixed w/o moving the button tag to the domNode.

comment:3 Changed 11 years ago by ninja

In tundra.css I took the padding out of: .tundra .dijitButtonNode and put it in: .tundra .dijitButtonNode button

Fixes the problem for me... not 100% perfect because the bottom border doesn't show up.. no big deal.. still looks ok. Better than having a button that works only 75% of the time.

comment:4 Changed 11 years ago by bill

I don't think this can be fixed w/o moving the button tag to the domNode.

I agree, although I don't see why that's difficult / why we didn't do it in the first place.

Also, one alternative would be to leave the <button> node where it is, but make the button hover effect and click event only on the <button> node, to make things more consistent.

comment:5 in reply to:  description Changed 10 years ago by davidmark

Replying to bill:

The Button template allows for various button styling, such as noir's rounded corner buttons (see templateThemeTest.html from 1.0.2.

However, clicking on the edges of the button (which is inside of Button.domNode but not part of the <button> node itself), although it will fire the onClick handler, it won't actually submit the form.

See attached testcase.

Not sure what (if anything) can be done about this but filing ticket for reference for now.

Sounds like another case of Dijit sacrificing usability for rounded corners or the like. If the theme breaks INPUT elements, it must be fixed or scrapped.

comment:6 Changed 9 years ago by liucougar

Resolution: duplicate
Status: newclosed

dup of #11108

comment:7 Changed 8 years ago by bill

Component: DijitDijit - Form
Note: See TracTickets for help on using tickets.