Forum: Rails Spinoffs (closed, excessive spam) Form.Observer and checkboxes

Form.Observer does not appear to correctly report when a checkbox ha
been updated.

if i am monitoring a form, and i check the box, it registers, but then
if i uncheck it it doesn't send a second trigger.

I'm not sure if it's related, but in IE you have to click somewhere else
on the page to trigger onchange for checkboxes. Does Form.Observer
register a change when you click somewhere else on the page?

-Hector

> I'm not sure if it's related, but in IE you have to click somewhere else
> on the page to trigger onchange for checkboxes.

That's a good point.  If you watch the 'click' event, though, you're
okay (rather than 'change').  Have to deal with the double-click
thing, too, with IE (the first click will 'click', the second if it's
fast enough will 'dblclick').
--
T.J. Crowder
tj / crowder software / com

I'm in Firefox. Even tried clicking outside and back it. It seems to
only register the first time you click it.

Both Hector and I seem to have missed the minor detail that you said
you were using Form.Observer.  :-)

A quick-and-dirty check works for me.  Are you sure the checkbox has a
name attribute?  That's important, because the change detection is
based on Form.serialize().  But if it were that, I would expect you to
get *no* change notifications, not one.

Try creating a pared-down test case and posting it; usually creating
it shows you what's wrong, but if not then you can post it and maybe
one of us'll see it.
--
T.J. Crowder
tj / crowder software / com

Try this out.

http://pastebin.com/m66282c9d

It includes a patch by kangax to include the element in the call
back::
http://prototype.lighthouseapp.com/attachments/267...

I can't reproduce this as well. Using FF3 (os x 10.5.3) everything
works as expected. A failing test case would be helpful.

- kangax

kangax, the code I supplied in pastebin worked for you? everytime you
check/uncheck the checkbox it displays it in the console?

This is more problematic than I have expected.
The reason why it doesn't work is because plain comparison (==) has
little effect when operands are arrays : )

I came up with a replacement but it's far from the best solution and
doesn't detect changed elements reliably (i.e. always returns first
element from the group of same-named ones).

This is probably a good candidate for a separate class, based on
Abstract.TimedObserver. The idea is to associate element with
serialized value when storing form "state". This way, it would be MUCH
easier to properly detect all changed elements, passing them to a
callback.

I'll take a look at it later.

Best,
kangax

/* another try */

Form.Observer = Class.create(Abstract.TimedObserver, {
  getValue: function() {
    return Form.serialize(this.element, true);
  },
  execute: function() {
    var value = this.getValue();
    var changedElements = [];
    for (var prop in value) {
      var valueProxy = { }, lastValueProxy = { };
      valueProxy[prop] = value[prop];
      lastValueProxy[prop] = this.lastValue[prop];
      if (Object.toQueryString(valueProxy) !==
Object.toQueryString(lastValueProxy)) {
        console.log(prop);
              changedElements.push(this.element.down('[name="'+ prop
+'"]'));
      }
    }
          if (changedElements.length > 0) {
            this.callback(this.element, Object.toQueryString(value),
changedElements);
            this.lastValue = value;
          }
  }
});

new Form.Observer('someForm', 0.3, function() {
  console.log(arguments);
});