Javascript Ajax Laravel返回视图500错误

我通过Ajax将幻灯片（jQueryUISlider）中的每个滑块值发送到我的控制器

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);
                }
            });
        },
    });

Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => 'ProductController@editProductPost']);

public function editProductPost(Request $request)
{
    $sliderValue = $request->get('value');
    Log::info($sliderValue);

    return view('productRom.edit', [
        'sliderValue' => $sliderValue
    ]);
}

<p>{{ isset($sliderValue) ? $sliderValue : "nothing" }}</p>

public function editProductPost(Request $request)
{
    return response()->json([
        'sliderValue' => $request->get('value')
    ]);
}

{
    'sliderValue': 4
}

因此，我的脑海中确实有这样的想法：

<meta name="csrf-token" content="{{ csrf_token() }}">

在我的控制器方法中，我这样称呼它：

    $("#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);
                }
            });
        },
    });

Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => 'ProductController@editProductPost']);

public function editProductPost(Request $request)
{
    $sliderValue = $request->get('value');
    Log::info($sliderValue);

    return view('productRom.edit', [
        'sliderValue' => $sliderValue
    ]);
}

<p>{{ isset($sliderValue) ? $sliderValue : "nothing" }}</p>

public function editProductPost(Request $request)
{
    return response()->json([
        'sliderValue' => $request->get('value')
    ]);
}

{
    'sliderValue': 4
}

Log:：info（$sliderValue）告诉我，我确实在每张幻灯片上获得了正确的滑块值

当我尝试返回编辑视图时，控制台中出现以下错误：

员额500（内部） 服务器错误）

我怎样才能解决这个问题

编辑

既然我有这一行：

<form action="{{ route($route) }}"...>

错误消失了，但当我尝试访问

$sliderValue

变量时，如下所示：

    $("#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);
                }
            });
        },
    });

Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => 'ProductController@editProductPost']);

public function editProductPost(Request $request)
{
    $sliderValue = $request->get('value');
    Log::info($sliderValue);

    return view('productRom.edit', [
        'sliderValue' => $sliderValue
    ]);
}

<p>{{ isset($sliderValue) ? $sliderValue : "nothing" }}</p>

public function editProductPost(Request $request)
{
    return response()->json([
        'sliderValue' => $request->get('value')
    ]);
}

{
    'sliderValue': 4
}

视图（ajax）：

---

您的路由名为editProductPost，但您正在搜索editProduct

您的控制器方法应如下所示：

    $("#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);
                }
            });
        },
    });

Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => 'ProductController@editProductPost']);

public function editProductPost(Request $request)
{
    $sliderValue = $request->get('value');
    Log::info($sliderValue);

    return view('productRom.edit', [
        'sliderValue' => $sliderValue
    ]);
}

<p>{{ isset($sliderValue) ? $sliderValue : "nothing" }}</p>

public function editProductPost(Request $request)
{
    return response()->json([
        'sliderValue' => $request->get('value')
    ]);
}

{
    'sliderValue': 4
}

您不应该将视图返回到ajax请求

您的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);
                }
            });
        },
    });

Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => 'ProductController@editProductPost']);

public function editProductPost(Request $request)
{
    $sliderValue = $request->get('value');
    Log::info($sliderValue);

    return view('productRom.edit', [
        'sliderValue' => $sliderValue
    ]);
}

<p>{{ isset($sliderValue) ? $sliderValue : "nothing" }}</p>

public function editProductPost(Request $request)
{
    return response()->json([
        'sliderValue' => $request->get('value')
    ]);
}

{
    'sliderValue': 4
}

---

你说“当我试图返回到编辑视图时，我在控制台中遇到了这个错误”试着点击post请求，你在预览下看到了什么？@haakym好的，我想我知道了，我会快速编辑问题1。你还没有做到我在第一次评论中所说的。2.正如我在前几天的聊天中所说，“…您的editProduct方法返回一个视图，如果您将其用于ajax，请不要返回视图，返回json数据”-希望这很清楚。嗯，好的，所以我不能使用ajax返回视图。但是如何进一步使用json数据呢？请参阅我的答案。我认为您需要阅读有关ajax请求如何工作的文档，然后才能理解为什么不能将其返回视图。想想为什么要使用ajax请求，这样就不需要离开当前页面/即当前视图-那么为什么要将其传递回视图呢。当您不使用ajax时，返回视图是非常有用的。你想返回json，这样你的

$。ajax

成功方法可以使用它。嗯，我将编辑我的答案，并让你知道我是如何编辑它的（仍然不起作用）