# Auto\_complete\_field and ENTER

**URL:** <https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285>\
**Category:** Rails\
**Created:** [January 27, 2008, 8:15pm UTC](https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285 "2008-01-27T20:15:04Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![sp00nyg](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/edb3f5/32.png) [@sp00nyg](https://www.ruby-forum.com/u/sp00nyg)\
**Post date:** [January 27, 2008, 8:15pm UTC](https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285/1 "2008-01-27T20:15:04Z")

</div>

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?

---

<div class="post-metadata">

**Author:** ![sp00nyg](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/edb3f5/32.png) [@sp00nyg](https://www.ruby-forum.com/u/sp00nyg)\
**Post date:** [January 27, 2008, 8:46pm UTC](https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285/2 "2008-01-27T20:46:51Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![sp00nyg](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/edb3f5/32.png) [@sp00nyg](https://www.ruby-forum.com/u/sp00nyg)\
**Post date:** [January 27, 2008, 9:25pm UTC](https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285/3 "2008-01-27T21:25:44Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![sp00nyg](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/edb3f5/32.png) [@sp00nyg](https://www.ruby-forum.com/u/sp00nyg)\
**Post date:** [January 27, 2008, 9:05pm UTC](https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285/4 "2008-01-27T21:05:41Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![sp00nyg](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/edb3f5/32.png) [@sp00nyg](https://www.ruby-forum.com/u/sp00nyg)\
**Post date:** [January 27, 2008, 9:35pm UTC](https://www.ruby-forum.com/t/auto-complete-field-and-enter/127285/5 "2008-01-27T21:35:10Z")

</div>

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