Ruby on Rails | Screencasts | Download | Documentation | Weblog | Community | Source

Ticket #7895 (new defect)

Opened 2 years ago

Last modified 7 months ago

[PATCH] Prototype's EventObserver fires only once when observing radio buttons

Reported by: plegato Assigned to: sam
Priority: high Milestone: 2.x
Component: Prototype Version: edge
Severity: normal Keywords:
Cc: carlivar, swindsor

Description

When observing radio button elements, change events are fired only once, the first time that particular radio button is clicked. Subsequent clicks on that button (to another button, then back to the first button) do not cause the observer code given to Prototype to execute. This is semantically incorrect.

Tim Morrow has described the issue in depth in two posts to the spinoffs mailing list, proposed several fixes, and provided code for one of them: http://www.arcknowledge.com/gmane.comp.lang.ruby.rails.spinoffs/2005-11/msg00008.html and http://www.arcknowledge.com/gmane.comp.lang.ruby.rails.spinoffs/2005-11/msg00009.html

Without too much work, it should be possible to integrate his RadioEventObserver transparently into the existing EventObserver.

Attachments

form_controlgroup.diff (1.0 kB) - added by jdalton on 03/31/08 07:00:05.

Change History

03/23/07 02:22:48 changed by plegato

One note - the provided code in the second message does not allow you to observe individual buttons by id; it allows you to observe the entire set of buttons with a given name, by name.

06/22/07 05:58:05 changed by carlivar

  • cc set to carlivar.

Ugh, just spent an hour troubleshooting this problem until I searched here.

Can we possibly update the docs, warning that the observers don't work fully with radio elements?

07/14/07 12:50:51 changed by pfaltstr

Is anyone working on this bug?

10/15/07 22:17:55 changed by swindsor

Any update at all here? The documentation should at least be changed to call out that radio buttons don't work properly with EventObserver. Ideally a work around could be presented or the prototype library could be changed.

10/15/07 22:18:53 changed by swindsor

  • cc changed from carlivar to carlivar, swindsor.

10/17/07 06:59:47 changed by wuhu2

How to to integrate this new RadioEventObserver transparently into the existing EventObserver?

11/23/07 17:11:38 changed by Coren

I can confirm this issue.

01/21/08 05:14:26 changed by kangax

This should work as long as radio buttons have unique "value" attributes. Could someone confirm if this fixes the issue?

03/17/08 11:42:10 changed by wepic

Not the prettiest work-around, but I suppose it works as a last resort until this ticket is patched in a more elegant way.

#my view:
<%= radio_button :user, :gender, :male, 
     :onclick => "new Ajax.Request('/users/update?gender=male',{asynchronous:true, evalScripts:true, parameters:value + '&authenticity_token=' + encodeURIComponent('#{@auth_token}')})" %>
#same but for female

I generated @auth_token with:

class ApplicationController < ActionController::Base
 before_filter :init_auth_token
 def init_auth_token
    @auth_token = authenticity_token_from_cookie_session
    #or, depending of session type
    @auth_token = authenticity_token_from_session_id
 end
end

03/31/08 07:00:05 changed by jdalton

  • attachment form_controlgroup.diff added.

03/31/08 07:03:13 changed by jdalton

This bug is 3 years old. Lets get it fixed :)!
I have uploaded a patch to create:
new Form.ControlGroup.EventObserver();

Test page:

<html>
<title>Radio Button Test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript">

  document.observe('dom:loaded', function(){
    new Form.ControlGroup.EventObserver('gender', function(element, value) {
      alert(element.id + ", " + element.name + ", last value: " + this.lastValue + ", value: " + value); 
    });
  });
</script>

</head>
<body>
<form id="myform">
	<input id="input1" type="radio" name="gender" value="0" checked="checked"/>
	<input id="input2" type="radio" name="gender" value="1" />
	<input id="input3" type="radio" name="gender" value="2" />
	<input type="checkbox" name="confirm" value=1" />
</form>
</body>
</html>

03/31/08 07:03:42 changed by jdalton

  • priority changed from normal to high.
  • summary changed from Prototype's EventObserver fires only once when observing radio buttons to [PATCH] Prototype's EventObserver fires only once when observing radio buttons.

11/26/08 02:02:44 changed by paulschreiber

I found a bug in the patch. As constructed, it doesn't work with field names with square brackets ([, ]) in them. i.e. <input name="foo[bar]">

If you have such a field, this.elements will return an empty array.

The problem is this line:

    this.elements = $$('input[name='+groupName+']');

Change it to this:

    this.elements = $$('input[name="'+groupName+'"]');