我正在通过Ajax将幻灯片(Jquery Ui Slider)中的每个滑块值传递到我的Controller。
Slider + Ajax看起来像这样:
$("#sliderNumCh").slider({ range: "min", min: 0, max: 20, step: 1, value: numbersOfChapters, change : function(e, slider){ $('#sliderAppendNumCh').empty(); var sliderValue = slider.value; var getSliderVal = document.getElementById('sliderValue').value = sliderValue; var getPrId = document.getElementById('editId').value; $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }); $.ajax({ type: 'post', url: "{{ Route('editProductPost', $product->id) }}", headers: { 'X-Requested-With': 'XMLHttpRequest' }, data: { value: getSliderVal, productId : getPrId }, success: function (option) { console.log(getSliderVal); } }); }, });
因此,我确实有这样的想法:
<meta name="csrf-token" content="{{ csrf_token() }}">
我的路线如下所示:
Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => 'ProductController@editProductPost']);
在我的Controller方法中,我这样调用它:
public function editProductPost(Request $request) { $sliderValue = $request->get('value'); Log::info($sliderValue); return view('productRom.edit', [ 'sliderValue' => $sliderValue ]); }
Log :: info($ sliderValue)告诉我,我确实在每张幻灯片上都获得了正确的滑块值。
当我尝试返回到编辑视图时,在控制台中出现此错误:
POST http:// localhost / myApp / public / product / edit / 73 500(内部服务器错误)
我该如何解决?
编辑
由于我认为这一行:
<form action="{{ route($route) }}"...>
路由变量未定义,因此我在return语句中添加了该变量。
return view('productRom.edit', [ 'sliderValue' => $sliderValue, 'route' => 'editProductPost' ]);
错误消失了,但是当我尝试$sliderValue像这样访问变量时:
$sliderValue
<p>{{ isset($sliderValue) ? $sliderValue : "nothing" }}</p>
它印给我 nothing
nothing
控制器:
public function editProductPost(Request $request) { return response()->json([ 'sliderValue' => $request->get('value') ]); }
查看(ajax):
$.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }); $.ajax({ type: 'post', url: "{{ Route('editProductPost', $product->id) }}", headers: { 'X-Requested-With': 'XMLHttpRequest' }, data: { value: getSliderVal, productId : getPrId }, success: function (response) { // check it has some data if (response.length) { // spit it out console.log(response); } else { console.log('nothing returned'); } } });
您的控制器方法应如下所示:
您不应该将视图返回给ajax请求。
您的ajax成功方法应如下所示(例如):
// first arg is the data returned by the controller method success: function (response) { console.log(response); }
它应该输出如下内容:
{ 'sliderValue': 4 }