estoy haciendo un CRUD con Laravel, AJAX y MySQL. El problema es que, a la hora de eliminar los registros, me pasa algo que no consigo entender. Cuando refresco la pagina, elimino un registro y todo va perfecto, sin embargo, al borrar el segundo, me vuelve a intentar borrar el primero (lo cual obviamente da un error 500) y el segundo lo hace bien, y asi sucesivamente con el tercer registro, cuarto, etc... Me intenta borrar todos los anteriores antes de ese.
Esta es la ventana modal del botón que llama a la función que elimina los registros:
<div id="delete-user" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Eliminar Usuario</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form>
@csrf
<p id="delete-user-txt"></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" id="remove_btn" class="btn btn-danger">Delete</button>
</div>
</form>
</div>
</div>
Petición AJAX que muestra la ventana modal y elimina los registros:
function show_delete_form(id) {
$.get('/admin/show-delete-form/' + id, function (user) {
$("#delete-user-txt").html('¿Desea eliminar el usuario ' + user + '?');
$('#delete-user').modal('toggle');
})
const token = $("input[name=_token]").val();
$('#remove_btn').click(function(e){
e.preventDefault();
let id_empty= id;
console.log(id_empty);
console.log('/admin/show-delete-form/' + id);
$.ajax({
url: "/admin/delete-register",
method: "POST",
data: {
id: id,
_token: token
},
success: function (res) {
if (res == true) {
console.log(res);
id_empty= "";
$('#delete-user').modal('hide');
toastr.info('El registro fue eliminado correctamente',
'Eliminar Registro', {
timeout: 3000
});
$('#users_table').DataTable().ajax.reload();
}
if (res == "same_admin") {
toastr.warning('No puedes eliminarte a ti mismo', 'Eliminar Registro', {
timeout: 3000
});
}
if (res == false) {
toastr.warning('Ha ocurrido un error', 'Eliminar Registro', {
timeout: 3000
});
}
}
})
})
}
La ruta control_panel que muestra la datatable:
function control_panel(Request $request)
{
if ($request->ajax()) {
# code...
$users = DB::table('users')->get('*');
return DataTables::of($users)
->addColumn('edit', function ($edit) {
$edit = '<td class="text-center"><a onclick="edit_user(' . $edit->id . ')">Editar</a></td>';
return $edit;
})
->addColumn('delete', function ($delete) {
$delete = '<td class="text-center "><a onclick="show_delete_form(' . $delete->id . ')">Borrar</a></td>';
return $delete;
})
->rawColumns(['edit', 'delete'])
->make(true);
}
return view('admin.controlpanel');
}
La ruta delete_register que muestra la datatable:
function delete_register(Request $request)
{
$id = $request->id;
$user = DB::table('users')->where('id', $id)->first();
if ($user->id == Auth::user()->id) {
return response()->json("same_admin");
} else {
$user_delete = DB::delete('delete from users where id = ?', [$id]);
if ($user_delete == 1) {
return response()->json(true);
} else {
return response()->json(false);
}
}
}
Gracias de antemano
$('#remove_btn').click(function(e){
por esto:$(document).off('click.req', '#remove_btn'); $(document).unbind('click.req', '#remove_btn'); $(document).on('click.req', '#remove_btn', function(e, xhr, settings){
console.log('/admin/show-delete-form/' + id);
muestra siempre en consola elid
que debería borrarse realmente? No conozco Laravel, pero esta lógica aquí me parece al menos confusa:$delete = '<td class="text-center "><a onclick="show_delete_form(' . $delete->id . ')">Borrar</a></td>';
¿$delete
es al mismo tiempo la cadena que estás construyendo y un objeto con una propiedadid
? Yo pondría cada ID en un sitio del que lo pueda recuperar sin ningún riesgo (en elvalue
delbutton
por ejemplo), y lo recuperaría conthis
en Javascript).