问题是用ajax和laravel发送数据到数据库



我正在尝试构建一个可排序的拖放列表,并且每次我将元素放入新区域时,顺序必须更改我使用ajax和laravel,但当我放下元素,我得到以下错误

POST http://localhost/pfe/public/prof/listpost 500 (Internal Server Error)

我的路由代码

Route::post('prof/listpost','listsController@update');

my controller code

<?php
namespace AppHttpControllers;
use IlluminateHttpRequest;
class listsController extends Controller
{
public function showlist()
{
$lists=AppModelslists::orderby('order','ASC')->get();
return view('questions.DragAndDrop',compact('lists'));
}
public function update(Request $request)
{
{
$lists = lists::all();

foreach ($lists as $list) {
foreach ($request->order as $order) {
if ($order['id'] == $list->id) {
$list->update(['order' => $order['position']]);
}
}
}

return response('Update Successfully.', 200);
}
}
}

我的视图代码,其中也包括ajax代码

@include ('header')
@include ('tableHeader')
<meta name="csrf-token" content="{{ csrf_token() }}">
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0">Subjects</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="{{route('dashboard')}}">Home</a></li>
<li class="breadcrumb-item active"><a href="{{route('adminShowProduits')}}">Produits</a></li>
</ol>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.container-fluid -->
</div>
<!-- /.content-header -->

<section class="content">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<a href="{{route('ProfAddSubject')}}" class="btn btn-success btn-sm"> <i class="fas fa-plus"></i> Add Subject </a>
<a href="#" class="BtnFiltrer btn-sm btn btn-primary"> <i class="fas fa-filter"></i> Filtrer</a>
<a href="#" class="BtnExporter btn-sm btn btn-primary"> <i class="fas fa-file-export"></i> Exporter</a>
</div>
<!-- /.card-header -->
<div class="card-body">
<table id="table" class="table table-bordered table-striped">
<thead>
<tr >
<th>name</th>
<th>order</th>
</tr>
</thead>
<tbody id="tablecontents">
@foreach ($lists as $list)

<tr class="row1" data-id="{{ $list->id }}">
<td>{{$list->nom}}</td>
<td>{{$list->order}} </td>
</tr>
@endforeach

</tbody>
<tfoot>
<tr>
<th>name</th>
<th>order</th>
</tr>
</tfoot>
</table>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</section>


</div>
<!-- /.content-wrapper -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.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">
$(function () {
$("#table").DataTable();
$( "#tablecontents" ).sortable({
items: "tr",
cursor: 'move',
opacity: 0.6,
update: function() {
sendOrderToServer();
}
});
function sendOrderToServer() {
var order = [];
var token = $('meta[name="csrf-token"]').attr('content');
$('tr.row1').each(function(index,element) {
order.push({
id: $(this).attr('data-id'),
position: index+1
});
});
$.ajax({
type: "POST", 
dataType: "json", 
url: "{{ url('prof/listpost') }}",
data: {
order: order,
_token: token
},
success: function(response) {
if (response.status == "success") {
console.log(response);
} else {
console.log(response);
}
}
});}  });
</script>


@include ('footer')
@include ('tableFooter')

像这样重构更新动作:

public function update(Request $request)
{
$lists = lists::all();
foreach ($lists as $list) {
foreach ($request->order as $order) {
if ($order['id'] == $list->id) {
$list->update(['order' => $order['position']]);
}
}
}

return response('Update Successfully.', 200);

}

如果你想返回json,那么你应该使用这个:

return response()->json(['success' => 'Update Successfully.'], 200);

最新更新