brutusin / json-forms

JSON Schema to HTML form generator, supporting dynamic subschemas (on the fly resolution). Extensible and customizable library with zero dependencies. Bootstrap add-ons provided
http://brutusin.org/json-forms
Apache License 2.0
607 stars 168 forks source link

Updating data immidiately #64

Closed shadow-identity closed 7 years ago

shadow-identity commented 7 years ago

Hi! Developing React app with json-forms component, I've faced with trouble: getData() should be fired after moving focus from one of its inputs to another element, because it uses .onchange event handler. Is there any way to make getData() work just after, say, inputting text (keypress in an input), without changing focus?

idelvall commented 7 years ago

Hi! Is it relevant you are using React? Can you create a jsfiddle with an example reproducing the problem? Thanks!

shadow-identity commented 7 years ago

Uhh, could you give me some working jsfiddle boilerplate for this? I just can't get element in JS from iframe's document :( https://jsfiddle.net/69z2wepo/70097/

idelvall commented 7 years ago

Here is one from the past https://jsfiddle.net/ajzmgkh4/1/

Be aware that the used library version probably is outdated

shadow-identity commented 7 years ago

Thanks a lot for a link. So this simple example shows you that getData() willn't return you updated data till you go out from a current field: https://jsfiddle.net/ajzmgkh4/4/ (I've added handlers to lines 77-82). So this isn't a React-related trouble.

idelvall commented 7 years ago

The form updates the model on onchange for performance issues but is easy to adapt to your needs triggering an onchange() on the element before getting the data:

myDiv.onkeyup = function(evt){
  evt.srcElement.onchange();
  console.log(bf.getData())
}