Bind the current row to delete cleanly

Modules/Core/Assets/js/components/DeleteComponent.vue

@@ -7,7 +7,8 @@
         props: {
             deleteAction: {default: null},
             deleteMessage: {default: "Are you sure you want to delete this record?"},
-            deleteTitle: {default: "Confirmation"}
+            deleteTitle: {default: "Confirmation"},
+            rowId: {default: null},
         },
         methods: {
             deleteRow(event) {
@@ -24,7 +25,8 @@
                                     type: 'success',
                                     message: response.data.message
                                 });
-                                $(event.path[3]).remove();
+
+                                $('#' + $self.rowId).remove();
                             }
                         })
                         .catch(function (error) {

Modules/Page/Resources/views/admin/index.blade.php

@@ -38,7 +38,7 @@
                         <tbody>
                         <?php if (isset($pages)): ?>
                         <?php foreach ($pages as $page): ?>
-                        <tr>
+                        <tr id="table-row-{{$page->id}}">
                             <td>
                                 <a href="{{ URL::route('admin.page.page.edit', [$page->id]) }}">
                                     {{ $page->id }}
@@ -64,7 +64,8 @@
                                     <a href="{{ URL::route('admin.page.page.edit', [$page->id]) }}" class="btn btn-default btn-flat"><i class="fa fa-pencil"></i></a>
 
                                     <delete-button
-                                            delete-action="{{ route('api.page.page.destroy', [$page->id]) }}">
+                                            delete-action="{{ route('api.page.page.destroy', [$page->id]) }}"
+                                            row-id="table-row-{{ $page->id }}">
                                     </delete-button>
                                 </div>
                             </td>

public/js/app.js

@@ -69057,7 +69057,8 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
     props: {
         deleteAction: { default: null },
         deleteMessage: { default: "Are you sure you want to delete this record?" },
-        deleteTitle: { default: "Confirmation" }
+        deleteTitle: { default: "Confirmation" },
+        rowId: { default: null }
     },
     methods: {
         deleteRow: function deleteRow(event) {
@@ -69075,7 +69076,8 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
                             type: 'success',
                             message: response.data.message
                         });
-                        $(event.path[3]).remove();
+
+                        $('#' + $self.rowId).remove();
                     }
                 }).catch(function (error) {
                     $self.$message({