title: Ajax Delete request ReactJS and Ruby on Rails
body: <p>I have a component called Items that lives within a parents called ItemsContainer. When a button in Items is clicked an Ajax function is called to delete that Item. </p>
  
  <p>At the moment however I am receiving a 500 error message and am not sure why. </p>
  
  <p><strong>Item Component</strong></p>
  
  <pre><code>class Item extends React.Component{
  
  constructor(props) {
      super()
  
      this.state = { 
          name: '',
          price: 0,
          code: '',
          id: ''
      }
  }
  
  componentWillMount() {
      this.setState({
          name: this.props.data.name,
          price: this.props.data.price,
          code: this.props.data.code,
          id: this.props.data.id
      })
  }
  
  deleteItem() {
      let finalUrl = '/items/' + this.state.id;
      $.ajax({
          type: "DELETE",
          url: finalUrl, /* THIS URL IS CALLING CORRECTLY ie. /items/8 */
          dataType: "json",
          success: function(response) {
              console.log("successfully deleted");
          },
          error: function () {
              console.log("error");
          }
      })
  }   
  
  
  render(){
      let itemName = this.props.data.name
      let itemCode = this.props.data.code
      let itemQuantity = 1
      let itemPrice = (this.props.data.price * itemQuantity).toFixed(2)
      const itemId = this.props.data.id
  
      return(
          &lt;tr&gt;
              &lt;td&gt;{itemName}&lt;/td&gt;
              &lt;td&gt;{itemCode}&lt;/td&gt;
              &lt;td&gt;{itemQuantity}&lt;/td&gt;
              &lt;td&gt;&lt;button className="btn btn-warning" onClick={this.deleteItem.bind(this)}&gt;Remove&lt;/button&gt;&lt;/td&gt;
              &lt;td&gt;£{itemPrice}&lt;/td&gt;
          &lt;/tr&gt;
      )
  }
  </code></pre>
  
  <p>}</p>
  
  <p><strong>Rails Items Controller</strong></p>
  
  <pre><code>class ItemsController &lt; ApplicationController
  
  def create
      @item = Item.new(item_params)
      if @item.save
          render partial: 'items/item', locals: {item: @item}
      else
          render json: @item.errors.to_json
      end
  end
  
  def destroy
      if @item.destroy
          render partial: 'items/item', locals: {item: @item}
      else
          render json: @item.errors.to_json
      end
  end
  
  private
  
  def item_params
      params.require(:item).permit(
          :name,
          :price,
          :code,
          :id
      )
  end
  </code></pre>
  
  <p>end</p>
  
  <p>Creating a new Item is working as expected but I can't work out why I am receiving my 500 error for my delete action. Any help would be much appreciated.</p>