title: Reactjs multiple form submit
body: <p>In my case, i would like to submit multiple forms in reactjs. But i have no idea on how to get the multiple form at Parent Component and submit.</p>
  
  <p>here is my code:</p>
  
  <pre><code>class BulkEditor extends React.Component {
      constructor(props) {
          super(props);
  
          this.state = {
              items: [],
              customCompanies: []
          };
  
          this.forms = [];
  
          this.onAddChild = this.onAddChild.bind(this);
          this.handleBulkSaveClick = this.handleBulkSaveClick.bind(this);
      }
  
      handleBulkSaveClick(event) {
          event.preventDefault();
      }
  
      /*
       * -- Add Children
       */
      onAddChild() {
          this.state.items.push(BulkEditorForm.defaultProps);
  
          this.setState({
              items: this.state.items
          });
      }
  
      render() {
          var forms = this.state.items.map(function(item, index) {                    
              return (
                      &lt;li className="list-group-item" key={index}&gt;                    
                          &lt;BulkEditorForm companies={this.state.customCompanies} item={item} 
                              ref="editorform"&gt;&lt;/BulkEditorForm&gt;
                      &lt;/li&gt;
              );
          }.bind(this));
  
          return (
                  &lt;ul className="list-group"&gt;
                      {forms}
                      &lt;li className="list-group-item"&gt; 
                          &lt;div className="btn-group btn-group-sm pull-right" role="group" aria-label="bulk-buttons"&gt;
                              &lt;a href="javascript:;" className="btn btn-primary" onClick={this.onAddChild.bind(this)}&gt;
                                  &lt;span className="glyphicon glyphicon-plus"&gt;&lt;/span&gt;
                              &lt;/a&gt;
                              &lt;a href="javascript:;" className="btn btn-default" onClick={this.handleBulkSaveClick}&gt;Bulk Save&lt;/a&gt;
                          &lt;/div&gt;
                          &lt;div className="clearfix"&gt;&lt;/div&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
          );
      }
  }
  </code></pre>
  
  <p>Here is next class</p>
  
  <pre><code>export default class BulkEditorForm extends React.Component {
      constructor(props) {
          super(props);
  
          this.handleFormSubmit = this.handleFormSubmit.bind(this);
      }
  
      handleFormSubmit(event) {
          event.preventDefault();
  
          alert("Submit");
      }
  
      render() {    
          return (
              &lt;form action='#' method="post" onSubmit={this.handleFormSubmit}&gt;                
                  &lt;button type="submit" className="btn btn-link"&gt;Save&lt;/button&gt;
              &lt;/form&gt;
          );
      }
  }
  </code></pre>