Laravel 使用 ajax 和 FomData() 错误响应更新表单

Question

我正在使用 Ajax 和 FormData() 来更新我的数据，让我展示我的代码

路由Route::resource( 'product_categories', ProductCategoryController::class );

这是重要的部分HTML和AJAX

<form class="form-horizontal" id="form-horizontal" role="form">
                        <div class="form-group hidden">
                            <label class="control-label col-sm-12" for="product-category-id">Product Category
                                id:</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="product-category-id"
                                       name="product-category-id">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-12"
                                   for="product-category-name-ar">{{ trans('interface.nameArabic') }}</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="product-category-name-ar"
                                       name="product-category-name-ar" value="any">
                                <p class="modalErrorProductCategory text-center alert alert-danger hidden"></p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-12"
                                   for="product-category-name-en">{{ trans('interface.nameEnglish') }}</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="product-category-name-en"
                                       name="product-category-name-en">
                                <p class="modalErrorProductCategory text-center alert alert-danger hidden"></p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-12"
                                   for="product-category-background-color">{{ trans('interface.backgroundColor') }}</label>
                            <div class="col-sm-10">
                                <input type="color" class="form-control" id="product-category-background-color"
                                       name="product-category-background-color">
                                <p class="modalErrorProductCategory text-center alert alert-danger hidden"></p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-12" for="product-category-image">
                                {{ trans('interface.image') }}
                            </label>
                            <div class="col-sm-10">
                                <input type="file" name="product-category-image" class="form-control"
                                       id="product-category-image">
                                <p class="modalErrorProductCategory text-center alert alert-danger hidden"></p>
                            </div>
                        </div>
                    </form>

/*Action on click edit button*/
        // Update Data

        $('.modal-footer').on('click', '.edit', function (e) {
            e.preventDefault();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            /*var form = $('#form-horizontal')*/
            var data = new FormData($('#form-horizontal')[0]);
            data.append('_method', 'PUT');

            $.ajax({
                type: "post",
                url: "{{ url('administration/product_categories') }}" + "/" + $('#product-category-id').val(),
                data: data,
                processData: false,
                contentType: false,
                error: function (data) {
                    $('#myModal').modal('show');
                    toastr["error"]("Check your inputs for errors", "Attention!!");
                    toastr.options = {
                        "closeButton": true,
                        "positionClass": "toast-top-right",
                        "showDuration": "300",
                        "hideDuration": "1000",
                        "timeOut": "5000",
                        "extendedTimeOut": "1000",
                        "showEasing": "swing",
                        "hideEasing": "linear",
                        "showMethod": "fadeIn",
                        "hideMethod": "fadeOut"
                    };
                    if (data.error(productCategory)) {
                        $('.modalErrorProductCategory').removeClass('hidden');
                        $('.modalErrorProductCategory').text(data.responseJSON.productCategory[0]);
                    }
                },

                success: function (data) {
                    $('#myModal').modal('hide');
                    $('.modalErrorProductCategory').addClass('hidden');
                    toastr["success"]("ProductCategory successfully edited", "Success!");
                    toastr.options = {
                        "closeButton": true,
                        "positionClass": "toast-top-right",
                        "onclick": null,
                        "showDuration": "300",
                        "hideDuration": "1000",
                        "timeOut": "5000",
                        "extendedTimeOut": "1000",
                        "showEasing": "swing",
                        "hideEasing": "linear",
                        "showMethod": "fadeIn",
                        "hideMethod": "fadeOut"
                    };
                    $('.item' + data.id).replaceWith("<tr class='item" + data.id + "'><td>" + data.id + "</td><td>" + data.translations[0]['name'] + "</td><td>" + data.translations[1]['name'] + "</td><td>" + data.background_color + "</td><td><img src='../../../" + data.image + "' alt='0000' style='width: 50px;'></td><td><button class='edit-modal btn btn-info' data-id='" + data.id + "' data-name-ar='" + data.translations[0]['name'] + "' data-name-en='" + data.translations[1]['name'] + "' data-background-color='" + data.background_color + "'><span class='fa fa-pencil-square-o'></span> {{ trans('interface.edit') }}</button> <button class='delete-modal btn btn-danger' data-id='" + data.id + "' data-name='" + data.name + "'><span class='fa fa-trash'></span> Delete</button></td></tr>");
                }
            });

        }); 

我的请求成功了 有些像这样的

POSThttp://localhost:8000/administration/product_categories/1

-----------------------------18998142404146031480821803985
Content-Disposition: form-data; name="product-category-id"

1
-----------------------------18998142404146031480821803985
Content-Disposition: form-data; name="product-category-name-ar"

اÙاطعÙØ©
-----------------------------18998142404146031480821803985
Content-Disposition: form-data; name="product-category-name-en"

Food
-----------------------------18998142404146031480821803985
Content-Disposition: form-data; name="product-category-background-color"

#00ff00
-----------------------------18998142404146031480821803985
Content-Disposition: form-data; name="product-category-image"; filename="Slide_2_Ar.jpg"
Content-Type: image/jpeg
....

但响应是 GET

GEThttp://localhost:8000/en/administration/product_categories/1
message "Method App\\Http\\Controllers\\Admin\\ProductCategoryController::show does not exist."

在我的控制器中

public function update( Request $request, ProductCategory $productCategory ) {
        dd( $request->all() );
        $productCategory->update( $request->all() );

        $data = ProductCategory::find( $productCategory->id );

        return response()->json( $data );
    }

没有请求显示路线

为什么它会返回 get？

Answer 1

1. 公共功能更新(请求$request, ProductCategory $productCategory) {

         dd( $request->all() );
         $productCategory->update( $request->all() );
   
         $data = ProductCategory::find( $productCategory->id );
   
         return response()->json( $data ); 
   
     }
   

你不需要用$data分配内存，你可以这样做

$productCategory->update($data);

return response()->json($productCategory);

1. ProductCategoryController 是否扩展了正确的 Laravel 控制器？

2. 使用php:artisan route:list 检查您的路线是否可达。

3. http://localhost:8000/**en**/administration/product_categories/1 !== http://localhost:8000/administration/product_categories/1

Answer 2

我认为您缺少 ProductCategoryController 中的功能显示。