Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Validation breaks when setting initial state. #3

Closed
mvandiest opened this issue Oct 21, 2015 · 4 comments
Closed

Validation breaks when setting initial state. #3

mvandiest opened this issue Oct 21, 2015 · 4 comments

Comments

@mvandiest
Copy link
Contributor

Maybe there is some other way to do this, but I'm having the following problem...

Using valueLink breaks validation as it does not go through formsy's getValue() behavior. If you attempt to pass a value prop, as you normally would with formsy, then that prop is spread down to the material-ui component and bypasses formsy's getValue() behavior as well.

I'm in a crunch so I don't have time to make a PR, but I've proven, at least for FormsyText that the following example using destructuring works:

let FormsyText = React.createClass({
  mixins: [ Formsy.Mixin, FormComponentMixin ],
  render: function() {
    var { value, ...other } = this.props;
    return (
      <TextField
        value={this.getValue()}
        {...other}
        onChange={this.handleChange}
        errorText={this.getErrorMessage()} />
    );
  }
});

I don't know whether the same destructuring can be used for the other fields. But I thought I'd start a dialog here around this problem.

@mbrookes
Copy link
Collaborator

I have to confess I hadn't come across valueLink - it doesn't appear to be documented other than appearing in a couple of examples.

The only form components that support it are textfield, datepicker, checkbox and toggle (and also textarea / enhanced-textarea, but both of those are completely undocumented, so not sure if they're supported features, so aren't included in this library yet).

If you would like to test your fix in those other three, I would be happy to accept accept a PR when you have the opportunity. Alternatively, if there's a better way to populate the value prop in the component, I'm open to suggestions.

mvandiest added a commit to mvandiest/formsy-material-ui that referenced this issue Oct 22, 2015
Fixes formsy#3

This commit addresses the issue of Formsy not being able to track form canSubmit state. Formsy requires the usage of the value prop to track internal state and allow the onValid and onInvalid callbacks to work properly.

Note that only the following Components were modiifed:

`FormsyDate, FormsyText, FormSelect`

There may be more work to do with the other MUI Components.
@mbrookes
Copy link
Collaborator

Hi @mvandiest - can you try this again now that FormsyText is rewritten, and value prop is supported for passing a default value to Textfield?

@mvandiest
Copy link
Contributor Author

Hey @mbrookes, sorry for the delay. So, I pulled the 0.3.2 in to my local demo and the value property works perfectly now. So, this issue can be closed. I'm not really sure which PR to attribute the fix to since there's been a lot of mods over the last month.

@mbrookes
Copy link
Collaborator

#23 / 0.2.5 I think. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants