On most operating systems it is possible to press a button by moving focus to it using the Tab key and then press the button using either Enter or Space.

When a submit button with #ajax functionality is pressed using Enter, ajax.js captures the event and does an AJAX callback. But if you press the button using Space, the event is not caught, and the form is submitted by reloading the whole page.

This patch captures both keys. Detecting keys in a cross-browser way is tricky (see http://www.quirksmode.org/js/keys.html). The which property is added by jQuery. For some reason this is not mentioned on http://docs.jquery.com/Events/jQuery.Event, but here is the relevant code from the un-minified version of jQuery 1.3.2

  // Add which for key events
  if ( !event.which && ((event.charCode || event.charCode === 0) ? event.charCode : event.keyCode) )
    event.which = event.charCode || event.keyCode;

I have only tested this on Firefox 3.6b4.

This issue was also present with AHAH in D6.

CommentFileSizeAuthor
ajax-space-1.patch948 bytesc960657

Comments

c960657’s picture

Issue tags: +Ajax
sun’s picture

Status: Needs review » Reviewed & tested by the community

Yep, agreed, nice patch! :)

rfay’s picture

brianV’s picture

Status: Reviewed & tested by the community » Closed (duplicate)

Duplicate of #607240: Usability: Allow AJAX behaviors to be triggered with spacebar.

Not that it matters which we stick with - the patch is near identical between the two of them, although one uses event.which() while the other uses event.keyCode(). Both work correctly across all major browsers.