title: React HandleDelete TypeError undefined
body: <p>I have React component called Websites to handle state</p>
  
  <pre><code>class Websites extends React.Component {
  
    constructor(props) {
      super(props);
      this.handleWebsiteDelete = this.handleWebsiteDelete.bind(this);
      this.state = {
        websites: this.props.websites
      }
    }
  
    handleWebsiteDelete(id) {
      console.log("delete")
      // How to Run This Function?
      // ...further code to delete id from state.websites
    }
  
    render () {
      return(
        &lt;div className="row"&gt;
          {
            this.state.websites.map(function(website, index) {
              return (
                &lt;WebsiteItem key={website.id} {...website} onDelete={this.handleWebsiteDelete}/&gt;
              )
            })
          }
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>Then I have React component called WebsiteItem with a function handleDelete an object:</p>
  
  <pre><code>class WebsiteItem extends React.Component {
  
    handleDelete(e) {
      e.preventDefault();
      $.ajax({
        method: "DELETE",
        url: "/websites/" + this.props.id 
      })
        .done(function(){
          this.props.onDelete(this.props.id);
        }.bind(this))
    }
  
    render() {
      return (
        &lt;div className="card"&gt;
          {this.props.name}
          &lt;a href="#" onClick={this.handleDelete.bind(this)}&gt;Delete&lt;/a&gt;
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>My goal is to delete a website from a server using ajax inside WebsiteItem component (successfully done) and run a function <code>onDelete</code> inside Websites component to update the state <code>this.state.websites</code>. </p>
  
  <p>I can't manage to run the function with an error: <code>Uncaught TypeError: this.props.onDelete is not a function</code> - I tried to play with bind(this) but not sure if I complete understand it. Thank you.</p>