Useful helpers - evaluating form's defaults
evalDefaults
Let's look one more on the example from previous section, in particular on the getInitialState
method:
var FG = window.FormGenerator
, t = window.FormGenerator.tools;
...
var App = React.createClass({
getInitialState: function () {
return {
value: t.evalDefaults( meta ), // this line
errors: {}
};
}
Here evalDefaults
helper allow us to get initial value of the form.
This function takes form's metadata, and brings together all defaultValue
properties in the fields
section.
validateForm
Another usefull helper is validateForm
. It takes form's meta and
value and returns information about form's validations errors in the
same format, which is required by property errors
of GeneratedForm.
So we can rewrite our example like this:
var FG = window.FormGenerator
, t = window.FormGenerator.tools
, GeneratedForm = FG({})
, validateForm = GeneratedForm.validateForm;
var App = React.createClass({
getInitialState: function () {
var value = t.evalDefaults( meta );
return {
value: value,
errors: validateForm( meta, value ) // this line
};
},
...
render: function() {
return (<GeneratedForm meta={meta}
value={this.state.value}
errors={this.state.errors}
onChange={this.handleFormChanged}/>);
}
Here is JSFiddle example with default value and errors:
Of course, it's not very useful to show validation errors before user
even starting to type anything. So in the next section you will see more real-like example of validateForm
using.