title: How to add a onclick event in ag-grid cell renderer reactjs and access the class function
body: <p>I would like to add a button for an ag-grid table column in reactjs at the time column definition. And onclick I need to call a class function.
  I would like to create onclick event and pass the params value to the function and make an api call from there.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>columnDefs = [{
      ..... {
        headerName: "View",
        field: "id",
        sortable: false,
        filter: false,
        colId: "view",
        cellRendererFramework: function(params) {
          return &lt;Button onclick = {
            this.handleClick
          } &gt; Test &lt; /Button&gt;
        },
  
      },
      ......
    ];
  }
  handleClick() {
    console.log("some API call and state change");
  }
  
  
  
  render() {
  
      return ( &lt;
        div &gt;
        &lt;
        div id = "myGrid"
        style = {
          {
            height: "100%",
            width: "100%"
          }
        }
        className = "ag-theme-material" &gt;
        &lt;
        AgGridReact enableSorting = {
          true
        }
        groupSelectsChildren = {
          true
        }
        rowData = {
          this.state.organization
        }
        columnDefs = {
          this.columnDefs
        }
  
        onGridReady = {
          this.onGridReady
        } &gt;
  
        &lt;
        /AgGridReact&gt;
  
        &lt;
        /div&gt;
  
  
      }
      export default OrganizationList;</code></pre>
  </div>
  </div>
  </p>