Deleting records from database in Laravel

Question

When I try to delete a record, it always deletes the last record in the database table instead of the one I wanted to delete.

Im fairly new to Laravel and I've exhausted all my options.

Routes

Route::middleware('auth')->prefix('users')->name('users.')->group(function(){

           Route::delete('/deleterecord/{record}'[RecordsController::class, 'destroy'])->name('destroyrecord');

}

Controller

public function destroy(Records $record) {

        $record->delete();
        DB::commit();
            
        return redirect()->route('users.viewrecord')->with('success', 'Customer deleted     successfully');
}

View

<!-- DataTales Example -->
       <div class="card shadow mb-4">
           <div class="card-header py-3">
               <h6 class="m-0 font-weight-bold text-primary">Records</h6>
           </div>
           <div class="card-body">
               <div class="table-responsive">
                   <table class="table-sm table-bordered" id="dataTable" width="100%" cellspacing="0">
                       <thead>
                           <tr>
                               <th width="10%">ID</th>
                               <th width="30%">Name</th>
                               <th width="15%">Student No</th>
                               <th width="10%">Batch No</th>
                               <th width="15%">Mobile</th>
                               <th width="20%">Email</th>
                               <th width="10%">Action</th>
                           </tr>
                       </thead>

                       <tbody>
                           @foreach ($records as $record)
                           <tr>
                               <td>{{ $record->id }}</td>
                               <td>{{ $record->name }}</td>
                               <td>{{ $record->student_number }}</td>
                               <td>{{ $record->batch_number }}</td>
                               <td>{{ $record->mobile_number }}</td>
                               <td>{{ $record->email }}</td>

                               <td style="display: flex">
                                   <a href="{{ route('users.editrecord', ['record' => $record->id]) }}" class="btn-sm btn-primary m-2">
                                       <i class="fa fa-pen"></i>
                                   </a>
                                   <a class="btn-sm btn-danger m-2" href="#" data-toggle="modal" data-target="#deleteRecordModal">
                                       <i class="fas fa-trash"></i>
                                   </a>
                               </td>
                           </tr>
                           @endforeach
                       </tbody>
                   </table>

               </div>
           </div>
       </div>
       </div>
@include('users.deleterecord-modal')

Modal

<div class="modal fade" id="deleteRecordModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalExample"
    aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="deleteModalExample">Delete Customer</h5>
                <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">Are you sure you want to delete?</div>
            <div class="modal-footer">
                <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
                <a class="btn btn-danger" href="{{ route('logout') }}"
                    onclick="event.preventDefault(); document.getElementById('record-delete-form').submit();">
                    Delete
                </a>
                <form id="record-delete-form" method="POST" action="{{ route('users.destroyrecord', $record->id) }}">
                    @csrf
                    @method('DELETE')
                </form>
            </div>
        </div>
    </div>
</div>

I tried running dd($record); in the controller, it shows no matter which record I delete, the ID that always gets deleted is the last one in the database table.

Answer 1

The problem in your code seems to be coming from the way you are getting the $record->id. As in your modal code you have

{{ route('users.destroyrecord', $record->id) }}

This will always get you the last record since the value of $record at that point will always be the last record.

Based on your code it seems that you are using bootstrap modal. I would suggest you to have an attribute on the link to represent the current id. Now your code for the delete button will be:

 <button type="button" class="btn-sm btn-danger m-2" data-toggle="modal" data-target="#deleteRecordModal" data-id="{{ $record->id }}"> ... </button>

here, I recommend using button tag instead of anchor tag.

Now, in Bootstrap there is an event called shown.bs.modal. On that event, you should be able to get that data-id attribute and modify the form action attribute to use that id for the link.

e.g: (I am using jQuery here which is not required in Bootstrap 5 )

$('#deleteRecordModal').on('shown.bs.modal', function (e) {
   const recordId = $(e.target).data('id');
   $('#record-delete-form').attr('action', `/users/deleterecord/${recordId}`)
})