Edit in JSFiddle

var FG            = window.FormGenerator
  , t             = window.FormGenerator.tools
  , GeneratedForm = FG()
  , validateForm  = GeneratedForm.validateForm;

var App = React.createClass({
    // ======================== Life cycle ======================= //
    getInitialState: function () {
        return {
            value:    t.evalDefaults( meta ),
            errors:   {}
        };
    },

    componentDidMount: function () {
        this._route = t.buildRouter(
            'btnSend:click', [ btnClickHandler ]
        );
    },

    // ======================== Handlers ========================= //

    handleFormChanged: function ( newValue, change, fldErrors ) {
        this.setState({ 
            value:   newValue,
            errors:  t.merge( this.state.errors, fldErrors )
        });
    },
    
    handleFormEvent: function ( fieldID, eventName, eventInfo ) { 
        this._route( fieldID + ':' + eventName );
    },


    // ======================== Renders ========================== //
    render: function() {
        return (<GeneratedForm meta={meta}
                               value={this.state.value}
                               errors={this.state.errors}
                               onChange={this.handleFormChanged}
                               onEvent={this.handleFormEvent}/>);
    }
});


function btnClickHandler () {
    this.setState({
        errors: validateForm( meta, this.state.value )
    });
}


React.render( <App />, document.body );
<script src="http://facebook.github.io/react/js/jsfiddle-integration.js"></script>
<script src="http://azaviruha.github.io/repo/js/react-form-generator.global.min.js"></script>

<script>
    window.meta = {
    "fields": {
        "field1": {
            "renderer": "text",
            "validators": [{
                "rule": "or",
                "value": [{
                    "rule": "and",
                    "value": [{
                        "rule": "alphabetics"
                    }, {
                        "rule": "length",
                        "value": 3
                    }]
                }, {
                    "rule": "and",
                    "value": [{
                        "rule": "numbers"
                    }, {
                        "rule": "length",
                        "value": 9
                    }]
                }],
                "message": "Only 3-characters CODE or 9-characters ID allowed"
            }]
        },
        "field2": {
            "renderer": "text",
            "defaultValue": "1",
            "validators": [
                {
                    "rule": "required",
                    "message": "Field is required"
                },
                {
                    "rule": "numbers",
                    "value": 5,
                    "message": "Only numbers allowed"
                }
            ]
        }, 
        "btnSend": {
            "renderer": "button",
            "rendererSpecific": {
                "text": "Send"
            }
        }
    },
    "layout": {
        "grid": {
            "css": "container demo-form",
            "rows": [{
                "css": "row",
                "cells": [{
                    "css": "col-xs-12 col-sm-12 col-md-10",
                    "content": [{
                        "renderer": "default",
                        "rendererSpecific": {
                            "fieldID": "field1",
                            "label": "or-and demo:",
                            "css": {
                                "wrapper": "row",
                                "label": "col-xs-2 col-sm-2 col-md-2",
                                "field": "col-xs-10 col-sm-10 col-md-10",
                                "errors": "col-xs-12 col-sm-12 col-md-12"
                            }
                        }
                    }]
                }]
            }, {
                "css": "row",
                "cells": [{
                    "css": "col-xs-12 col-sm-12 col-md-10",
                    "content": [{
                        "renderer": "default",
                        "rendererSpecific": {
                            "fieldID": "field2",
                            "label": "Field #2:",
                            "css": {
                                "wrapper": "row",
                                "label": "col-xs-2 col-sm-2 col-md-2",
                                "field": "col-xs-10 col-sm-10 col-md-10",
                                "errors": "col-xs-12 col-sm-12 col-md-12"
                            }
                        }
                    }]
                }]
            }, {
                "css": "row",
                "cells": [{
                    "css": "col-xs-12 col-sm-12 col-md-10",
                    "content": [{
                        "renderer": "unwrapped",
                        "rendererSpecific": {
                            "fieldID": "btnSend",
                            "css": "btn col-xs-3 col-sm-3 col-md-1"
                        }
                    }]
                }]
            }]
        }
    }
}
</script>


<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

              

External resources loaded into this fiddle: