Auto_complete_field and ENTER

Rails
1

I use auto-complete to help with tag entry and a few other areas. Some
example code is:

Tags (ex: “sales compliance”, marketing, fast)</
label>

<%= form.text_field :tag_list, :maxlength => 255, :id =>
‘f_r_tags’, :autocomplete => ‘off’ %>
<%= ajax_spinner_for(‘f_r_tags’) %>
<%= content_tag(‘div’, ‘’, :class => ‘auto_complete’, :id =>
‘f_r_tags_auto_complete’) %>
<%= auto_complete_field(‘f_r_tags’, :url =>
autocomplete_tags_requests_path, :method => :get, :frequency =>
0.5, :indicator => ‘f_r_tags_spinner’, :tokens => ‘,’) %>

Everything works great, but how do I prevent ENTER from submitting the
form. When people use this, they usually start typing, see the tag
they want, use the arrow keys to select the tag, then hit enter to
select it. However, rather than do what is expected, the form gets
submitted. It drives the user nuts.

I want enter to submit the form only when not selecting a tag from the
auto-complete list. Is this possible?

2

After some more digging, it seems like I’m not the only one seeing
this: http://dev.rubyonrails.org/ticket/2600.

3

Which element do I add :onkeypress to?

Also, this problem looks to be limited to FF 2 on OSX. Enter does not
submit the form on Safari 3, WinFF2, or IE7.

4

On Jan 27, 2008, at 8:13 PM, gobigdave wrote:

<%= auto_complete_field(‘f_r_tags’, :url =>
auto-complete list. Is this possible?
Yes, you can prevent form submission capturing the return key. To do
that include something like this in tag_options:

 # starting point, needs more work to be portable
 :onkeypress => "return event.which == Event.KEY_RETURN ? false :

true"

– fxn

5

On Jan 27, 2008, at 9:24 PM, gobigdave wrote:

Which element do I add :onkeypress to?

The option goes in the hash that is the 3rd argument of
text_field_with_auto_complete.

Also, this problem looks to be limited to FF 2 on OSX. Enter does not
submit the form on Safari 3, WinFF2, or IE7.

Yes, I am no JavaScript expert but experience says that particular
issue is a bit brittle.

I don’t like disabling the return key that way indeed. I’d prefer to
let the user select with the keyboard using the return key in the
completion list, and still be able to send the form if he’s in the
very text field. I have not found a way to accomplish that in a robust
and portable way.

– fxn