How can i define a delete method inside the delete button, It is returning the id of what i am trying to delete which means it is using get

Question

So here are the index and destroy function but the delete button is not working properly and just giving me a blank page with the ID

Controller

//this is the index

public function index()
{
    if(request()->ajax()) {
        return datatables()->of(Aya_div::select('*'))
            ->addIndexColumn()
            ->addColumn('action', function ($id) {
                $btn = '<a href="'.route("aya_div.show", $id).'" class="edit btn btn-info btn-sm">View</a>';
                $btn = $btn.'<a href="'.route("aya_div.edit", $id).'" class="edit btn btn-primary btn-sm">Edit</a>';
                $btn = $btn.'<a href="'.route("aya_div.destroy", $id).'" class="edit btn btn-danger btn-sm">Delete</a>';

                return $btn;
            })
            ->rawColumns(['action'])
            ->make(true);
    }
        
    return view('aya_div.index');
}

//this is the destroy function

public function destroy($id)
{
    $div = Aya_div::find($id);
    $div->delete();

    return redirect()->route('aya_div.index')->with('successs', 'Data Deleted');
}

I am expecting the way of defining a method in a button

Answer 1

What you are currently calling is the GET REQUEST, while instead you need to use laravel DELETE REQUEST you can follow the below example:

Step 1: Pass data-id= ID

Step 2: Call the delete button to ajax

Full code:

<a class="delete" href="javascript:void(0);" data-id="123">Delete</button>
        
<a class="delete" href="javascript:void(0);" data-id="555">Delete</button>
        
<script>
   $(function () {
      $('.delete').on('click', function () {
        var id = $(this).attr("data-id");
        $.ajax({
            type:'POST',
            url:'/theURL',
            data: {
                "id": id,
                "_method": 'DELETE',
                "_token": '<?php echo csrf_token() ?>',
            },
            success:function(data){
               alert('success');
            },
            error: function(result) {
               alert('error');
            }
         });
      });
   });
</script>

If you click the first delete button, it will pass the ID=123, if you click the second button you will pass the ID=555, you can also also accomplish the same thing using tables, but hopefully this serves as a sufficient reference to what you can do.