javascript - bind component method from callback to child component -

i new react js , unable pass parent component method child in foreach loop.my code is

below app component.i trying show data got api in table looping child component recordrow.

var app=     react.createclass({  qwerty: function(name) {             alert("qwerty");             alert(name);          },         render:function(){      /* table header , border */                 //alert("result2:"+this.state.result)                 var rows = [];                 var data = this.state.result;                 if(data){                     data.foreach(function(data2,i){                         rows.push(<recordrow  data={data2}  key={i} fun ={this.qwerty}/>)                     });                 }                 return(                     <table classname="table table-bordered">                     <tr>                     <th>zipcode</th>                     <th>shortcode</th>                     <th>city</th>                     <th>state</th>                     <th>taxcode</th>                     <th>userid</th>                     <th></th>                     </tr>                     <tbody>                     {rows}                      </tbody> </table> <div classname="modal"> . . //modal popup code . </div> )  } }); 

and when click edit button below,i want send data object of record row parent component , show in alert there.how achieve it?

var recordrow=     react.createclass({             submit:function(){                 if(this.props.fun) {                     alert("fun")                     this.props.fun("harsha");                 }             },             render:function() {                 return (                      <tr>                     <td>{this.props.data.zipcode}</td>                     <td>{this.props.data.shortcode}</td>                     <td>{this.props.data.city}</td>                     <td>{this.props.data.state}</td>                     <td>{this.props.data.taxcode}</td>                     <td>{this.props.data.userid}</td>                     <td><input type="button" classname="btn btn-primary" data-toggle="modal" data-target="#modaling" onclick={this.submit} value ="edit"/></td>                     </tr>                 )             }     }); 

you have errors in code:

1. try return 2 different react elements in `app`->`render()` 2. using `result` don't define state 3. didn't bind context callback method, this.qwerty undefined 

i created fiddle fixed version.