Re-render a partial when a form field is updated

Rails
1

I would like to learn how to update a partial when a text field is
updated. What would be the best way to go about doing this? I’m sort
of stuck on how to generally accomplish this.

I’m basically creating a page with a list of contacts, and at the top,
there is a search box that will filter the contacts based on what the
user submits. With javascript disabled, it will re-display the page
with the filtered contacts. With it enabled, it will dynamically update
the div with the list of contacts as the user types in the text field.

Thanks for any help in advance.

2

Steve C. wrote:

I would like to learn how to update a partial when a text field is
updated. What would be the best way to go about doing this? I’m sort
of stuck on how to generally accomplish this.

Have you looked at observe_field or a simple JS onchange?

I’m basically creating a page with a list of contacts, and at the top,
there is a search box that will filter the contacts based on what the
user submits. With javascript disabled, it will re-display the page
with the filtered contacts.

With JS disabled, you’ll need an actual submit button.

With it enabled, it will dynamically update
the div with the list of contacts as the user types in the text field.

Thanks for any help in advance.

Best,
–Â
Marnen Laibow-Koser
http://www.marnen.org
[email protected]

3

Marnen Laibow-Koser wrote:

Have you looked at observe_field or a simple JS onchange?
I’ve been looking over the API, but I guess I’m so new to Rails that I’m
having a hard time grasping out to get it to work correctly. I’ll
continue to investigate observe_field; thanks for the tip.

With JS disabled, you’ll need an actual submit button.
That’s what I was thinking - if the user has javascript disabled, then
I’d show a submit button; otherwise it’d be hidden. I think the first
step is to get it to work without javascript, so a simple search form to
update the page would be a good first step.

I’m watching this now to see if it helps:
http://media.railscasts.com/videos/037_simple_search_form.mov

4

Steve C. wrote:

Marnen Laibow-Koser wrote:

Have you looked at observe_field or a simple JS onchange?
I’ve been looking over the API, but I guess I’m so new to Rails that I’m
having a hard time grasping out to get it to work correctly. I’ll
continue to investigate observe_field; thanks for the tip.

With JS disabled, you’ll need an actual submit button.
That’s what I was thinking - if the user has javascript disabled, then
I’d show a submit button; otherwise it’d be hidden. I think the first
step is to get it to work without javascript, so a simple search form to
update the page would be a good first step.

Prototype has a function to Ajaxify a form and hide the submit button.
I think there’s a Rails helper for it too, but I avoid the Rails helpers
– they mix JS into HTML, which is usually a bad idea.

I’m watching this now to see if it helps:
http://media.railscasts.com/videos/037_simple_search_form.mov

Best,
–Â
Marnen Laibow-Koser
http://www.marnen.org
[email protected]

5

Marnen Laibow-Koser wrote:

Have you looked at observe_field or a simple JS onchange?

So I’ve been experimenting with the observe_field and observe_form, but
I can’t seem to get it to respond to any updates. My first logical next
step was to make sure the DOM id was being specified correctly, but I
double checked that and tried it for both a text field and the form
itself (using observe_form) and nothing happens.

I opened up Firebug in FF to see if there was anything going on in the
console, but alas - it’s void of any updates when I enter text into the
search form.

Here’s the code I’m using at the moment. Can anyone spot any errors?

<% observe_field ‘search_contacts_form’,
:function => “alert(‘Element changed’)”
%>

For the moment, I’m just trying to make the browser give an alert to
make sure it’s monitoring the changes.