Observe_form, observe_field, dynamic forms help please

Rails
1

Setup:

A form which initially has only one field: a 2x group of radio_buttons.
As the user selects options, additinal fields are added or removed.

I started with observe_field. I was getting some very peculiar behavior
from observe_field and finally figured out why =>

Observe field only works for the first click. So it’s not suitable for
a form that reacts to user input since a user may select/unselect an
option multiple times.

Next, I decided to use observe_form. At first, it seemed to overcome
the problems of observe_field and reacted to every click of the
radio_button. But then I discovered that it doesn’t observe changes in
fields that are not in the original source (the fields added by the
user). So I’m back to ground zero.

I suppose I could build all the DOM objects from scratch and roll my
own functions for adding/removing and call them via onclick(), but I
was hoping to get away from some of the:

var myDiv = document.createElement(‘div’);
var link = document.createElement(‘a’);
link.setAttribute(‘href’, ‘somepage.php’);
var text = document.createCreateTextNode(‘Link Name’);

link.appendChild(text);
myDiv.appendChild(link);

in lieu of rjs goodness like:
myElement = “

Link Name
”
page.replace_html :elementId, myElement

Any help appreciated

2

krunk- wrote:

option multiple times.

page.replace_html :elementId, myElement

Any help appreciated

You can get around the limitations of the observe_form by stopping the
observer just before modifying the form and then restarting it again
after inserting the new elements.

_Kevin

3

_Kevin wrote:

a form that reacts to user input since a user may select/unselect an
was hoping to get away from some of the:
myElement = “

”
page.replace_html :elementId, myElement

Any help appreciated

You can get around the limitations of the observe_form by stopping the
observer just before modifying the form and then restarting it again
after inserting the new elements.

_Kevin

Thank you, Kevin.

After some googling, mailing list searching, etc. I found two vague
references to functions that might be appropriate here: Event.stop()
and stopObserving(). I’m not completely sure how to use either of
these.

I went to scriptaculous and read the description of stopObserving:

Event.stopObserving(element, name, observer, [useCapture]);

I looked at my page source and got:

new Form.EventObserver(‘process_call_form’, function(element, value)
{new Ajax.Request(’/rails/assistant/add_element’, {asynchronous:true,
evalScripts:true, parameters:‘Form.serialize(process_call_form)=’ +
value})})

As the observer method.

Now, element I would assume to be the id of the observed object
(process_call_form). Name doesn’t seem to have a direct correlation.

From the scriptaculous example, I think it is the action that is being
observed. I also assume that in the case of observe_form it’s change.

So that gives me: Event.stopObserving(‘process_call_form’, ‘change’,
observer);

My guess for observer in this case would be: Form.EventObserver. But
I’m not sure.

And lastly, once the event has been stopped…how do you restart it?

-james

4

I’ll give this a little bump. I tried to pick a very simple case to
test out rails javascript abstraction.

5

Bill W. wrote:

option multiple times.

I’m using observe_field on check_box fields to trigger rjs updates and
having no problem with multiple select/unselect actions. Might be able to
help if you provide some additional info.

Best regards,
Bill

Sure, the one click is for radio_buttons only.

Here you go:
http://www.thoughtstoblog.com/articles/2006/10/27/observe_field-with-radio-buttons

6

Hi James,

krunk wrote:

Observe field only works for the first click.

Could you say more about what you mean by ‘for the first click’ and what
you
saw that caused you to come to this conclusion?

So it’s not suitable for a form that reacts to
user input since a user may select/unselect an
option multiple times.

I’m using observe_field on check_box fields to trigger rjs updates and
having no problem with multiple select/unselect actions. Might be able
to
help if you provide some additional info.

Best regards,
Bill

7

Sorry.
Its working fine with 2 radio buttons but not for 3.

8

Hi,

Can you please specify the in detail the observe_field that you have
used for 2x radio buttons??

Im also facing the same problem. My observe field is working fine for 3
radio buttons but for 3 I dont understand hoe to make it work??

krunk- wrote:

Setup:

A form which initially has only one field: a 2x group of radio_buttons.
As the user selects options, additinal fields are added or removed.

I started with observe_field. I was getting some very peculiar behavior
from observe_field and finally figured out why =>

Observe field only works for the first click. So it’s not suitable for
a form that reacts to user input since a user may select/unselect an
option multiple times.

Next, I decided to use observe_form. At first, it seemed to overcome
the problems of observe_field and reacted to every click of the
radio_button. But then I discovered that it doesn’t observe changes in
fields that are not in the original source (the fields added by the
user). So I’m back to ground zero.

I suppose I could build all the DOM objects from scratch and roll my
own functions for adding/removing and call them via onclick(), but I
was hoping to get away from some of the:

var myDiv = document.createElement(‘div’);
var link = document.createElement(‘a’);
link.setAttribute(‘href’, ‘somepage.php’);
var text = document.createCreateTextNode(‘Link Name’);

link.appendChild(text);
myDiv.appendChild(link);

in lieu of rjs goodness like:
myElement = “

”
page.replace_html :elementId, myElement

Any help appreciated