I am using this jquery plugin, jQuery Plugin For Editable Table Rows - Table Edits , to make editable tables in an application made in Laravel but I have the following problem: When I want to send the data of the record that I want to edit through ajax I get the error NotFoundHttpException in RouteCollection.php line 161: I understand that this has to do with the definition of the routes, but in the route.php file if they are defined and I also tried to define a specific route to access the update method directly but it did not work either. I hope you can help me. Greetings and thanks in advance.
html
<!DOCTYPE html>
<html>
<head>
<title>Laravel</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="{{ URL::asset('components/bootstrap/dist/css/bootstrap.css') }}">
<link rel="stylesheet" href="{{ URL::asset('components/datatables.net-bs/css/dataTables.bootstrap.min.css') }}">
<link rel="stylesheet" type="text/css" href="{{ URL::asset('components/datatables.net-bs/css/editor.bootstrap.css')}}">
<link rel="stylesheet" type="text/css" href="{{ URL::asset('components/datatables.net-bs/css/editor.dataTables.css')}}">
</head>
<body>
<h1>Ejemplo de Edición en el lugar con jQuery</h1>
<div class="container">
<div class="mensaje"></div>
<table class="table tablaEdit" id="tablaEditable">
<thead>
<tr>
<th>Nombre</th>
<th>Apellidos</th>
<th>Email</th>
<th>Telefono</th>
</tr>
</thead>
<tbody>
@foreach($tablas as $tabla)
<tr data-id="{{$tabla->id}}">
<td id="nombre" class="tvalor" data-field="nombre"> {{ $tabla->nombre}}</td>
<td id="apellidos" data-field="apellidos"> {{ $tabla->apellidos }}</td>
<td id="email" data-field="email"> {{ $tabla->email }}</td>
<td id="telefono" data-field="telefono"> {{ $tabla->telefono }}</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.3.js"> </script>
<script type="text/javascript" src="{{ URL::asset('components/bootstrap/dist/js/bootstrap.js') }}"> </script>
<script type="text/javascript" src="{{ URL::asset('js/script.js') }}"></script>
<script type="text/javascript" src="{{ URL::asset('js/table-edits.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.js"></script>
<script type="text/javascript" src="{{ URL::asset('components/datatables.net-bs/js/dataTables.bootstrap.min.js') }}"></script>
</body>
</html>
jQuery
$(document).ready(function(){
$("#tablaEditable tr").editable({
keyboard: true,
dblclick: true,
button: true,
buttonSelector: ".edit",
dropdowns: {},
maintainWidth: true,
save: function(values) {
var idusuario = $(this).data('idusuario'); //captura el id en la tabla
$.ajax({
url: '/editar/' + idusuario,
data: values,
type: "PUT",
dataType: 'json',
success: function (data) {
alert("Editado");
}
});
}
});
});
Routes
Route::put('/editar/{idusuario}', 'TablaController@update');
Route::resource('/', 'TablaController' , ['except' => ['update']]);
list of routes:
Error in console:
UPDATE: Fixed, I had a couple of errors in the definition of the model and I also removed the JSON.stringfy function from jQuery since it was not very useful.