ListItem OnClick react is not working

nadinugraha

Hi,

I’m developing an application based on React using Onsen UI. I tried to list of data using ListItem in which if I click an item on the list it will go to other page. But, the problem is I always get error message <function name> is not a function. My code is as follows :

constructor(props) {
    super(props);
    this.onGetData2X = this.onGetData2X.bind(this);
}

onGetData2X(id) {
     this.props.navigator.pushPage({component: JobDetail, props: {orderid : id,navigator: this.props.navigator}});
}


renderRow(row, index) {    
  return (
     <ListItem tappable key={index} onClick={()=>this.onGetData2X(row.id)}>
            <div className='center'>
                <span class="list-item__title">{row.ordercode}</span>
            </div>
        </ListItem>
    );
}

render() {
    return (
          <Page>
             <List
                      dataSource={this.state.rows}
                      renderRow={this.renderRow}
                      renderHeader={() => <ListHeader>Click to view 
                          details</ListHeader>}
            />
        </Page>
    );
}

Is onClick in ListItem correct ?

Thanks