Nuby: How to use onKeyPress to call JavaScript?

Rails
1

Hi,

I’m new to rails, so please be nice to me :slight_smile:

I’m trying to do some simple JavaScript in Rails but am having a lot of
difficulty getting it to work.

Basically, I have a form with a text field. When the user types in the
text field, I want to respond to each key press event and update another
field on the screen.

I want to do this without a round-trip to the server.

In straight HTML, it would look something like this:

I’ve tried many permutations of the text_field_tag and none of them seem
to work as I expect. The closest I got was

<%= text_field_tag ‘answer’, nil, :onkeypress => “alert(‘asdf’)” %>

but I can’t seem to get it to call my own javascript function.

i.e. this doesn’t work
<%= text_field_tag ‘answer’, nil, :onkeypress => “test(this)” %>

Is what I’m trying to do even possible?

2

Have you tried using another function name besides “test.” Initially
this confused me too, but then I thought maybe “test” is a keyword in
JavaScript so I tried something else and it seems to work just fine.

Craig User wrote:

i.e. this doesn’t work
<%= text_field_tag ‘answer’, nil, :onkeypress => “test(this)” %>

Is what I’m trying to do even possible?

3

On Aug 19, 6:57 am, Robert W. [email protected]

4

Try this function:
http://api.rubyonrails.com/classes/ActionView/Helpers/PrototypeHelper.html#M001636
It “observes” a field in the form and calls a callback function, ajax
functions by default.

You must include prototype library too. Use the helper <%=
javascript_include_tag :defaults %>

On Aug 19, 6:57 am, Robert W. [email protected]

5

Thank you all for your help. I was able to get this working by doing
the following:

<%= observe_field ‘answer’, :function => “getStyle($F(‘answer’))”,
:frequency => 1 %>

and then in my application.js

function getStyle(answer) {
var styleField = document.getElementById(‘style’);
styleField.innerHTML = answer
}

In the interests of DRY though, does anyone know how to pass in a
non-form variable to my javascript function so that I don’t have to do
the document.getElementById lookup?

i.e.
getStyle($F(‘answer’), $P(‘otherElement’))

I guess I’m asking if there’s a ‘page’ equivalent to the ‘form’
shorthand “$F”.

6

On Tue, Aug 19, 2008 at 6:29 PM, Craig User
[email protected] wrote:

In the interests of DRY though, does anyone know how to pass in a
non-form variable to my javascript function so that I don’t have to do
the document.getElementById lookup?

Have you looked at http://prototypejs.org/api/utility ?

–
Hassan S. ------------------------ [email protected]