insin / newforms

Isomorphic form-handling for React
http://newforms.readthedocs.org/
Other
642 stars 48 forks source link

SplitDateTimeWidget, etc fields aren't tracked in state (form.data)? #112

Open blainegarrett opened 9 years ago

blainegarrett commented 9 years ago

I've been working on writing a custom MultiWidget Widget. However, I ran into a snag that the keys of the inputs were not in valueFromData's data argument unless they were explicitly interacted with. Once you gave a multiwidget's input focus and blurred, then the key/val for that specific input was available in the form.data argument, but no others of the same MultiWidget.

I tested this behavior on the stock SplitDateTimeWidget and it feels similar. My guess is that the fields are not being initialized in the state tracking of the form? This is evidenced when focusing in some other field. It does appear that decompress is being called initially to populate the field, but it just seems like it isn't being put in the virtual dom perhaps? I have controlled: true on my form with onChange: this.forceUpdate.bind(this)

I'm not sure if this is a bug or a newbie issue.

Update: As per my followup below, this is happening on the "all fields" example as well when modified to have initial data.

blainegarrett commented 9 years ago

I believe I got it mostly working now, but still have a pair of issues.

I restarted my fiddling with the vanilla all forms example (https://github.com/insin/newforms-examples/tree/master/all-fields). When this form is given an initial value of: var default_data = { SplitDateTimeField: new Date() }; the inputs are blank and there is a validation error. After tinkering, I realized this is because the seconds are being added to the input. Changing the time format to include seconds (var timeFormat = '%H:%M:%S') made it work as expected. i.e. the fields were filled in by default and when submitting the finalized value was in the output. So it works, sorta.

The remaining issues:

  1. I can't seem to get the stock SplitDateTimeWidget to not display seconds. When I leave off the %S in the timeFormat string, they do not display, but the field doesn't validate. I'm debating implementing my own version of the widget to get this to work, but would prefer not to.
  2. If you give the time input focus and the blur it, the "required field" message pops up, even though it is clearly filled in. Focus the date input, and things are fine.

Here's a gif of the focus wierdness. http://g.recordit.co/fQ3Q7PlhEl.gif

I'm running newforms@0.12.1 and react@0.13.3

benekastah commented 8 years ago

I'm not using the SplitDateTimeField; rather I'm making my own MultiValueField subclass. I'm having the same issues though; even though decompress is called in the widget, it is never included in the form.data until the fields are actually interacted with. Seems like a bug to me, but perhaps there's an undocumented step that is required?