首页 > 解决方案 > 通过 Ajax 向 Laravel 控制器提交带有文本和图像的表单

问题描述

使用 Laravel 7 jQuery v3.4.1

我正在尝试通过 Ajax 将表单的内容发送到 Laravel 控制器。该表单包含一个文本字段和一个文件字段。我想找到一种方法在一个请求中发送两种类型的字段。

看起来内容已发送,但 Laravel 无法读取并返回错误。

我的 Ajax 代码

$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
}); 
    
var form = $('form')[0]; 
var formData = new FormData(form);

    
    
$.ajax({
            url: form.attr('action'),
            data: formData,
            cache: false,
            method:'POST',
            contentType: false,
            processData: false,
            success: function (data) {

             console.log(data);
                
            },
            error: function (error,jqXHR, textStatus, errorThrown) {
                
                
              console.log(data.error);          
                
            }
        });
    

表格

<form id="newProduct" action="{{route('Product.store',app()->getLocale())}}" method="POST" enctype="multipart/form-data">
        @csrf
        <input name="title" maxlength="10" length="10" placeholder="Product Title" type="text" id="title" class="form-control>
        <input type="file" name="files" id="files" class="files">
</form> 

Laravel 函数

public function store(Request $request)
{
        dd($request->input->all());
}

数据通过 ajax 发送,但不知何故 Laravel 无法访问它。我从 Laravel调用到 null 上的成员函数 all()收到以下错误消息, 返回代码为 500。

这是通过 ajax 发送给 Larval 的 http 请求的摘录

-----------------------------23552347725043592001228805073 内容处置:表单数据;名称=“标题”自卫队

为了让 Laravel 可以读取数据,需要进行哪些更改?提前致谢。

标签: jqueryajaxlaravel

解决方案


根据评论,$request->input它不是Illuminate\Http\Request类的属性,因此调用all()它会返回 null,因为它不存在。

正如您所发现的,所有输入都可以使用all()辅助函数$request->all().

或者,输入可以单独检索,输入作为函数$request->input('field')$request->get('field'). where$request->input()也可以得到嵌套的条目$request->input('form.name'),有些事是get()做不到的。


推荐阅读