# Observe\_field loses event binding after firing

**URL:** <https://www.ruby-forum.com/t/observe-field-loses-event-binding-after-firing/112980>\
**Category:** Rails\
**Created:** [August 25, 2007, 10:40am UTC](https://www.ruby-forum.com/t/observe-field-loses-event-binding-after-firing/112980 "2007-08-25T10:40:47Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![wolfram](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/e68b1a/32.png) [@wolfram](https://www.ruby-forum.com/u/wolfram)\
**Post date:** [August 25, 2007, 10:40am UTC](https://www.ruby-forum.com/t/observe-field-loses-event-binding-after-firing/112980/1 "2007-08-25T10:40:47Z")

</div>

I’m running into an odd problem where I’m observing two radio buttons  
via observe\_field to make AJAX calls, and it seems to lose the event  
binding after the first call.

The basic functionality is that clicking on the “teacher” radio button  
will show the list of subjects, while clicking on the “student” button  
will hide these again.

The portions of the rhtml template:

\<%= radio\_button\_tag “user\_type”, “Student”, true %\>Student  
\<%= observe\_field “user\_type\_student”, :url =\> { :action =\>  
“ajax\_hide\_subject\_list” }, :method =\> :get %\>  
\<%= radio\_button\_tag “user\_type”, “Teacher”, false %\>Teacher  
\<%= observe\_field “user\_type\_teacher”, :url =\> { :action =\>  
“ajax\_show\_subject\_list” }, :method =\> :get %\>

```
<ul id="ajax_subject_list" style="display:none">
  <%= render :partial => "subject", :collection => @subjects %>
</ul>

```

The corresponding controller actions:

def ajax\_show\_subject\_list  
render :update do |page|  
page.show :ajax\_subject\_list  
end  
end

def ajax\_hide\_subject\_list  
render :update do |page|  
page.hide :ajax\_subject\_list  
end  
end

Very simple. The problem I’m seeing is that an AJAX call is fired  
only on the first click. Subsequent clicks don’t do anything. It  
looks like the binding of the event to the DOM ID is lost somehow  
during the server update.

Questions:  
What are good debugging tools to find out what events are associated  
to a given DOM ID?  
Is this a Rails bug? Are there workarounds short of going to full  
custom Javascript?

Thanks,

Wolf

---

<div class="post-metadata">

**Author:** ![wolfram](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/e68b1a/32.png) [@wolfram](https://www.ruby-forum.com/u/wolfram)\
**Post date:** [August 31, 2007, 8:22am UTC](https://www.ruby-forum.com/t/observe-field-loses-event-binding-after-firing/112980/2 "2007-08-31T08:22:55Z")

</div>

No replies here, so we figured out a workaround ourselves. In the reply  
from the server, we add a replace call to submit a new observe\_field  
that hooks to the radio buttons.

I think think there should be an easier way to call some Prototype API  
to re-register the existing handler, but this works for now.

Make a partial, \_observers.rhtml:

 \<%= observe\_field "user\_type\_student", :url =\> { :action =\> "ajax\_hide\_subject\_list" }, :method =\> :get %\> \<%= observe\_field "user\_type\_teacher", :url =\> { :action =\> "ajax\_show\_subject\_list" }, :method =\> :get %\>

Be sure this partial is rendered on the template somewhere. This will  
hook up the observers when the page is first loaded.

Then, on the ajax updates, re-submit the partial again:

def ajax\_show\_subject\_list  
render :update do |page|  
page.show :ajax\_subject\_list  
page.replace “observers”, :partial =\> “observers”  
end  
end

def ajax\_hide\_subject\_list  
render :update do |page|  
page.hide :ajax\_subject\_list  
page.replace “observers”, :partial =\> “observers”  
end  
end

---

<div class="post-metadata">

**Author:** ![wolfram](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/e68b1a/32.png) [@wolfram](https://www.ruby-forum.com/u/wolfram)\
**Post date:** [September 6, 2007, 6:49pm UTC](https://www.ruby-forum.com/t/observe-field-loses-event-binding-after-firing/112980/3 "2007-09-06T18:49:39Z")

</div>

Oh, just found this bug entry you may be interested in:

[http://dev.rubyonrails.org/ticket/7895](http://dev.rubyonrails.org/ticket/7895)

---

<div class="post-metadata">

**Author:** ![wolfram](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/e68b1a/32.png) [@wolfram](https://www.ruby-forum.com/u/wolfram)\
**Post date:** [September 6, 2007, 6:54pm UTC](https://www.ruby-forum.com/t/observe-field-loses-event-binding-after-firing/112980/4 "2007-09-06T18:54:40Z")

</div>

Hi,

I have just run in to that problem. The difference is that I am using  
a :function instead of a :url for now. Anyway, adding a :frequency  
seemed to solve the problem. Now my :function is properly fired every  
time a field change is observed.

HTH

–  
Yves-Eric