title: DELETE http://localhost:8000/product/[object%20Object] 500 (Internal Server Error)
body: <p>I'm setting up the ajax for delete method like this and I have got some error in the link, like 500 internal server error, I've done with all tutorial and get a little bit frustration so please correct my code</p>
  
  <p>this is a laravel 5.8 and jquery 3.3 </p>
  
  <pre><code>&lt;section class="section"&gt;
    &lt;div class="section-header"&gt;
      &lt;h1&gt;Our Products&lt;/h1&gt;
      &lt;div class="section-header-button"&gt;
        &lt;button id="createProduct" class="btn btn-primary"&gt;Add New&lt;/button&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="section-body"&gt;
      &lt;div class="row mt-4"&gt;
        &lt;div class="col-12"&gt;
          &lt;div class="card"&gt;
            &lt;div class="card-header"&gt;
              &lt;h4&gt;All Items&lt;/h4&gt;
            &lt;/div&gt;
            &lt;div class="card-body"&gt;
              &lt;div class="clearfix mb-3"&gt;&lt;/div&gt;
              &lt;div class="table-responsive"&gt;
                &lt;table id="itemList" class="table table-striped"&gt;
                  &lt;thead&gt;
                    &lt;tr&gt;
                      &lt;th&gt;Product Code&lt;/th&gt;
                      &lt;th&gt;Product Name&lt;/th&gt;
                      &lt;th&gt;Categories&lt;/th&gt;
                      &lt;th&gt;Price&lt;/th&gt;
                      &lt;th&gt;Action&lt;/th&gt;
                    &lt;/tr&gt;
                  &lt;/thead&gt;
                  &lt;tbody id="dataTable"&gt;
                    @include('product.table')
                  &lt;/tbody&gt;
                &lt;/table&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/section&gt;
  
  
  &lt;!-- Modal  --&gt;
  &lt;div class="modal fade" id="tambahProductModalLong" tabindex="-1" role="dialog" aria-labelledby="tambahProductModalLongTitle" aria-hidden="true"&gt;
    &lt;div class="modal-dialog" role="document"&gt;
      &lt;div class="modal-content"&gt;
        &lt;div class="modal-header"&gt;
          &lt;h5 class="modal-title" id="tambahProductModalLongTitle"&gt;Modal title&lt;/h5&gt;
          &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;
            &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
          &lt;/button&gt;
        &lt;/div&gt;
        &lt;form id="addProductForm"&gt;
          @csrf
          &lt;input type="hidden" name="id" id="id"&gt;
          &lt;input type="hidden" name="product_code" id="productCode"&gt;
          &lt;div class="modal-body"&gt;
            &lt;div class="form-group"&gt;
              &lt;div class="section-title"&gt;Product Name&lt;/div&gt;
              &lt;input required id="name" type="text" name="name" class="form-control"&gt;
            &lt;/div&gt;
            &lt;div class="form-group"&gt;
              &lt;div class="section-title"&gt;Categories&lt;/div&gt;
              &lt;select name="categories" class="form-control select2"&gt;
                @foreach($categories as $c)
                &lt;option value="{{$c-&gt;id}}"&gt;{{$c-&gt;name}}&lt;/option&gt;
                @endforeach
              &lt;/select&gt;
            &lt;/div&gt;
            &lt;div class="form-group"&gt;
              &lt;div class="section-title"&gt;Price&lt;/div&gt;
              &lt;div class="input-group"&gt;
                &lt;div class="input-group-prepend"&gt;
                  &lt;div class="input-group-text"&gt;
                    IDR
                  &lt;/div&gt;
                &lt;/div&gt;
                &lt;input required id="price" type="number" name="price" class="form-control currency"&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="modal-footer"&gt;
            &lt;button type="button" class="btn btn-secondary" data-dismiss="modal"&gt;Close&lt;/button&gt;
            &lt;button type="submit" id="saveButton" class="btn btn-primary"&gt;&lt;/button&gt;
          &lt;/div&gt;
        &lt;/form&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  </code></pre>
  
  <pre><code>
  @foreach($products as $p)
  &lt;tr&gt;
      &lt;td&gt;{{$p-&gt;code}}&lt;/td&gt;
      &lt;td&gt;{{$p-&gt;name}}&lt;/td&gt;
      &lt;td&gt;{{$cat = App\Category::where('id', $p-&gt;categories_id)-&gt;first()-&gt;name}}&lt;/td&gt;
      &lt;td&gt;IDR {{number_format($p-&gt;price)}}&lt;/td&gt;
      &lt;td&gt;
          &lt;a id="editProduct" data-id="{{$p-&gt;id}}" href="#" class="btn btn-icon edit btn-sm btn-primary"&gt;
              &lt;i class="far fa-edit"&gt;&lt;/i&gt;
          &lt;/a&gt;
          &lt;a id="deleteProduct" data-id="{{$p-&gt;id}}" href="#" class="btn btn-icon delete btn-sm btn-danger"&gt;
              &lt;i class="far fa-trash-alt"&gt;&lt;/i&gt;
          &lt;/a&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  @endforeach
  </code></pre>
  
  <p>this is my ajaax method</p>
  
  <pre><code>
      function load() {
        $.ajax({
          url: "{{route('product.load')}}",
          success: function(response) {
            $('#dataTable').html(response);
          }
        });
      }
  
      $.ajaxSetup({
        headers: {
          "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr('content')
        }
      });
  
       //delete
      $('.delete').click(function(e) {
        e.preventDefault();
        // console.log(1);
        var id = $(this).data(id);
        // console.log(id);
        confirm("Are you sure want to delete?");
  
        $.ajax({
          type: "DELETE",
          data: {
            "id": id,
            "_token": "{{csrf_token()}}"
          },
          url: "/product/" + id,
          success: function(data) {
            if (data.status == "sukses") {
              alert("data berhasil dihapus");
              load();
            } else {
              alert("data gagal dihapus");
            }
          }
        });
      });
  </code></pre>
  
  <p>routes</p>
  
  <pre><code>Route::delete('/{id}', ['as' =&gt; 'destroy', 'uses' =&gt; 'ProductContntroller@destroy']);
  </code></pre>
  
  <pre><code>    public function destroy($id)
      {
          Product::destroy($id);
          $response['status'] = "sukses";
  
          return Response::json($response);
      }
  
  </code></pre>
  
  <p>i got en error like this in the console</p>
  
  <pre><code>localhost::8000/product/[Object%20object] 
  </code></pre>