json-schema-form / angular-schema-form

Generate forms from a JSON schema, with AngularJS!
https://json-schema-form.github.io/angular-schema-form
MIT License
2.47k stars 653 forks source link

onChange not working on arrays with simple values #468

Open scotttrinh opened 9 years ago

scotttrinh commented 9 years ago

I have a bunch of form fields of various types, including fixed-size arrays (tuples). I have to send the changes to a separate service for syncing, and until now, I've just been sending the whole object with a scope watch. This has worked, but I'm trying to refactor to only send the changed values, rather than the whole object. I've come up with a generic onChange handler that will handle normal fields, and if I attach them manually to the form definition, it seems to work. The issue is with arrays. How/where do I attach these onChange handlers so that if it gets called for all of the array values? I would be content with a change handler on the array itself that just gave me the new value of the whole array, if that's simpler.

nicklasb commented 9 years ago

Isn't ASFs own onChange triggered on arrays?

scotttrinh commented 9 years ago

It doesn't seem to be. Let me see if I can make a minimal plunker.

scotttrinh commented 9 years ago

Plunker here

nicklasb commented 8 years ago

Is this still a problem?

scotttrinh commented 8 years ago

Yes, as evidenced in the plunker. console.log fires when you change the string, but not when you change the array's value. That makes sense, honestly, since you're not changing the identity of the array, just the values, but I'm trying to solve this particular problem and looking for a way to do so.

Anthropic commented 8 years ago

@scotttrinh thanks for the update, good plunker thanks, I've tagged issue appropriately, it seems simple arrays are not firing as you demonstrated.

The issue revolves around the onChange handling code testing for form.onChange

  if (form && form.onChange) {
    ctrl.$viewChangeListeners.push(function() {
      if (angular.isFunction(form.onChange)) {
        form.onChange(ctrl.$modelValue, form);
      } else {
        scope.evalExpr(form.onChange, {'modelValue': ctrl.$modelValue, form: form});
      }
    });
  }

But that doesn't work when the form item is the array item as there is no onChange attached to it, it needs to look through the tree and find any parent onChange events and attach them as well. But that's currently not as easy as I'd like, which may be better with the split out core.

I am curious to know if the new core will fix this, if not I will look into it if no PR is created by then.

scotttrinh commented 8 years ago

@Anthropic thanks for looking into it. I noticed that same bit of code when I was troubleshooting, which is what caused me to open this issue to see if there was a more "correct" way other people already use.