onValidSubmit, onSubmitted on <form> tag #361Description
Hi,
I am new here and try to make the login example work. I get this error:
Warning:Unknown propsonValidSubmit,onSubmittedon<form>tag. Remove these props from the element. For details, see https://fb.me/react-unknown-prop
in form (created by Formsy)
in Formsy (created by App)
import React, { Component } from 'react';
import { Form } from 'forms-react';
import Formsy from 'forms-react';
const MyInput = React.createClass({
// Add the Formsy Mixin
mixins: [Formsy.Mixin],
// setValue() will set the value of the component, which in
// turn will validate it and the rest of the form
changeValue(event) {
this.setValue(event.currentTarget[this.props.type === 'checkbox' ? 'checked' : 'value']);
},
render() {
// Set a specific className based on the validation
// state of this component. showRequired() is true
// when the value is empty and the required prop is
// passed to the input. showError() is true when the
// value typed is invalid
const className = 'form-group' + (this.props.className || ' ') +
(this.showRequired() ? 'required' : this.showError() ? 'error' : '');
// An error message is returned ONLY if the component is invalid
// or the server has returned an error message
const errorMessage = this.getErrorMessage();
return (
<div className={className}>
<label htmlFor={this.props.name}>{this.props.title}</label>
<input
type={this.props.type || 'text'}
name={this.props.name}
onChange={this.changeValue}
value={this.getValue()}
checked={this.props.type === 'checkbox' && this.getValue() ? 'checked' : null}
/>
<span className='validation-error'>{errorMessage}</span>
</div>
);
}
});
export default MyInput;
// App component - represents the whole app
export default class App extends Component {
constructor(props) {
super(props)
this.state = {canSubmit: false }
}
submit(data) {
alert(JSON.stringify(data, null, 4));
}
enableButton() {
this.setState({ canSubmit: true });
}
disableButton() {
this.setState({
canSubmit: false,
});
}
render() {
return (
<Form className="login">
<MyInput name="email" title="Email" validations="isEmail" validationError="This is not a valid email" required />
<MyInput name="password" title="Password" type="password" required />
<button type="submit" disabled={!this.state.canSubmit}>Submit</button>
</Form>
);
}
}
Anyone can help me please ?