javascript - ReactJS Error Button on click reference method not defined -

i'm using reactjs create , render table button last column:

                    var cols = [                        { key: 'id', label: 'id'}  ,                        { key: 'revlock', label: 'revlock' },                        { key: 'revision', label: 'revision' },                        { key: 'name', label: 'name' },                        { key: 'projectnumber', label: 'project number' },                        { key: 'description', label: 'description' },                        { key: 'createddate', label: 'created date' },                        { key: 'language', label: 'language' }                     ];                       var table = react.createclass({                         getinitialstate: function () {                           return { data: [] };                        },                         componentdidmount: function () {                           this.loadprojectsfromserver();                        },                         loadprojectsfromserver: function () {                           var xhr = new xmlhttprequest();                           xhr.open('get', this.props.dataurl, true);                           xhr.onload = function () {                              var data = json.parse(xhr.responsetext);                              this.setstate({ data: data });                           }.bind(this);                           xhr.send();                        },                         render: function () {                           var headercomponents = this.generateheaders(),                           rowcomponents = this.generaterows();                            return (                              <table>                                 <thead> {headercomponents} </thead>                                 <tbody> {rowcomponents} </tbody>                              </table>                           );                        },                         generateheaders: function () {                           var cols = this.props.cols;                            return cols.map(function (coldata) {                               return <th key={coldata.key }>{coldata.label}</th>                           });                        },                         openelem: function ( ) {                            console.log('clicked ')                        },                         generaterows: function () {                           var cols = this.props.cols;                           data = this.state.data                               return data.map(function (item) {                               var cells = cols.map(function (coldata, idx, arr) {                                 return (idx === arr.length -1)                                            ? <td>{item[coldata.key]}<doorbutton openitems={this.openelem }/></td>                                             : <td>{item[coldata.key]}</td>;                              });                                return <tr key={item.id }>{cells}</tr>;                           });                        },                     });                      var doorbutton = react.createclass({                         handleclick: function (e) {                            this.props.openitems();                        },                         render: function () {                           return (                              <button onclick={this.handleclick}>open doors</button>                           );                        }                     });                      reactdom.render(                        <table cols={cols}  dataurl="/project/getprojects" />,                        document.getelementbyid('projecttable')                     ); 

this code works fine though when click on button um getting following error

uncaught typeerror: this.props.openitems not function.

how may trigger onclick event button in raw ?