Hello there,
I'm running in a very strange 'bug' with the javascript in commerce checkout which disables the button to avoid it's clicked twice.
It seems this javascript also reacts on pressed 'enters'.
This conflicts with an autocomplete in the checkout-pane's. When you use an autocomplete (to be precise, for an entity reference) and you type some first letters, the autocomplete shows some options. If you choose an option with key arrows and press enter on the selected option. The commerce checkout javascript is also called, which disables the option to goto to the next step.
Selecting the autocomplete option by mouse, doesn't trigger the javascript (which is offcourse good). Using an enter in a textfield, also doesn't seem to trigger the javascript.
I have absolutely no knowloedge of javascript, but seems an extra check to see, if the pressed key comes from the submit button may be the solution.
Hopefully my issue is clear.
Comment | File | Size | Author |
---|---|---|---|
#9 | commerce-double_click_false_positive.patch | 788 bytes | John Franklin |
Comments
Comment #1
rszrama CreditAttribution: rszrama commentedCan you tell me how you've setup your site so we can reproduce the issue? An enter press on an autocomplete widget shouldn't be triggering form submission.
Comment #2
mallezieYou can test on http://krinkel.mallezie.kiplin-drupal01.chiro.be/krinkel-2013
If You choose one of the product's, you enter a registration form. (From entity_registration / Commerce_registration module).
There you have a field 'Groep' or 'Ploeg' (dependant on your first choice) where you can select an entity reference (type 'sche' for example, that generates results). Making a choice, with the arrows, and pressing enter, blocks the 'continue' button. (At lesast tested in chromium and firefox).
Comment #3
rszrama CreditAttribution: rszrama commentedYeah, this is really odd behavior. The JavaScript is even specifically attached to the click event of the button, not even just general form submission which I'd expect to introduce problems on an enter press:
I guess we need to find out if this is a general problem or just related to your site, but I can't see why the browser is interpreting enter as a click on that button. :-/
Comment #4
mallezieI found some sort of solution with following javascript code.
I found some information on following links:
http://stackoverflow.com/questions/12325066/button-click-event-fires-whe...
http://stackoverflow.com/questions/4763638/enter-triggers-button-click/4...
It seems that perhaps disabling the button as submit button should do the trick.
Comment #5
mallezieAlso noticed that hitting the enter key on a select-element doesn't trigger the click event. Neither when hitting enter in a text-area.
Comment #6
John Franklin CreditAttribution: John Franklin commentedThis is a serious problem with Commerce Registration sites. The registration pane includes a user autocomplete. Hitting enter to select a user from the autocomplete triggers the javascript and makes it impossible to "Continue to next step."
Comment #7
John Franklin CreditAttribution: John Franklin commentedHere's mallezie's JS as a patch. Thanks, mallezie.
Comment #9
John Franklin CreditAttribution: John Franklin commentedRe-roll the patch for the benefit of the testing bot.
Comment #10
vasikeisn't this part of #2598918: Prevent checkout form submission when "Enter" is pressed on checkout text inputs?