title: react-admin: Handle click event in Custom Field within a <Datagrid>
body: <p>In our react-admin application, first we display a products list. </p>
  
  <p>On each row we also display a TextField (to allow user input number of copies) and a 'Print' button.</p>
  
  <p>The snippet as below:</p>
  
  <pre><code>export const ProductList = props =&gt; (
    &lt;List filters={&lt;ProductFilter /&gt;} exporter={false} {...props} &gt;
      &lt;Datagrid rowClick="edit" &gt;
        &lt;TextField source="id" /&gt;
        &lt;TextField source="productName" /&gt;
        &lt;PrintPanel label="Print" /&gt;
      &lt;/Datagrid&gt;
  &lt;/List&gt;
  );
  </code></pre>
  
  <p>with custom field <code>PrintPanel</code> as below:</p>
  
  <pre><code>import TextField from '@material-ui/core/TextField';
  import Button from '@material-ui/core/Button';
  
  class PrintPanel extends React.Component {
    state = {
      copies: 1,
    }
    render() {
      return (
        &lt;span&gt;
          &lt;TextField label="Number of copies"/&gt;
          &lt;Button variant="contained" color="primary"
            onClick={() =&gt; alert(1)}   // PROBLEM: this is NOT called when user click the button
          &gt;
            Print
          &lt;/Button&gt;
        &lt;/span&gt;
      );
    }
  }
  </code></pre>
  
  <p>The problem is: when user click the 'Print' button, react-admin open the 'Edit' page instead and Button's onclick is not called.</p>
  
  <p>My question is: how to fix this?</p>