Hello. There is a list of resources. I want to delete a specific resource. But the first one is deleted.

@foreach($catalogs as $catalog) <tr> <th scope="row">{{ $catalog->id }}</th> <td>{{ $catalog->name }}</td> <th>{{ $catalog->created_at->format('Ym-d') }}</th> <td> <div class="btn-group btn-group text-center"> <a class="btn btn-danger waves-effect waves-light btn-sm mr-5" role="button" id="deletebtn" data-url="catalog" data-id="{{ $catalog->id }}" onclick="confirmDelete()"><i class="zmdi zmdi-delete"></i></a> <a class="btn btn-primary waves-effect waves-light btn-sm" role="button"><i class="zmdi zmdi-edit"></i></a> </div> </td> </tr> @endforeach

// jquery

 function confirmDelete(id) { swal({ title: "Вы уверины?", text: "Вы не сможете восстановить данный ресурс!", type: "warning", showCancelButton: true, cancelButtonText: 'Отмена', confirmButtonClass: 'btn-danger', confirmButtonText: "Да, удалить!", closeOnConfirm: false }, function (isConfirm) { if (!isConfirm) return; var id = $('#deletebtn').data('id'); var url = $('#deletebtn').data('url'); $.ajax({ url: url + '/' + id, type: "delete", data: id, dataType: "html", headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') }, success: function () { swal("Готово!", "Ресурс успешно удален!", "success"); }, error: function (xhr, ajaxOptions, thrownError) { swal("Ошибка!", "Попробуйте еще раз", "error"); } }); }); }

Here is the question. How to indicate that the script would delete exactly the element on which the click was made?

  • This removes the wrong resource to be deleted. If, for example, in table 9 of resources, I press the button to delete a resource with id 5, but the first resource (topmost) is deleted with id 1 and not with id 5 - Alex_01
  • You create html elements with duplicate id . Therefore, there is always the first of them. - Igor
  • $ this is such a keyword, you recognize its id and successfully delete it - Lieutenant Jim Dangle
  • @LieutenantJimDangle thanks. Already googled) - Alex_01
  • one
    Well done , cowboy) - Lieutenant Jim Dangle

1 answer 1

Found a solution onclick="confirmDelete(this)"

 function confirmDelete(element) { var button = element.id; }