javascript - 在 Laravel 文件上传时无法识别文件错误“调用成员函数 store() on null”
问题描述
我正在使用 Laravel、Ajax 和 Datatables 来管理我的信息，一切正常，但我需要将文件上传到它。但是我在 null 上调用成员函数 store()。
这是控制器功能的代码（发布和获取）：
function postdata(Request $request)
{
$validation = Validator::make($request->all(), [
'referencia' => 'required',
'tipo_equipo' => 'required',
'tipo_servicio' => 'required',
'id_reporte' => 'required',
]);
$error_array = array();
$success_output = '';
if ($validation->fails())
{
foreach($validation->messages()->getMessages() as $field_name => $messages)
{
$error_array[] = $messages;
}
}
else
{
if($request->get('button_action') == 'update')
{
$servicio = Servicio::find($request->get('servicio_id'));
$servicio->referencia = $request->get('referencia');
$servicio->tipo_equipo = $request->get('tipo_equipo');
$servicio->tipo_servicio = $request->get('tipo_servicio');
$servicio->id_reporte = $request->get('id_reporte');
$servicio->imagen_inicio = $request->file('imagen_inicio')->store('public/img/servicio');
$servicio->imagen_fin = $request->get('imagen_fin');
$servicio->pdf_reporte = $request->get('pdf_reporte');
$servicio->save();
$success_output = '<div class="alertaTables alert alert-success">Servicio Actualizado</div>';
}
}
$output = array(
'error' => $error_array,
'success' => $success_output
);
echo json_encode($output);
}
function fetchdata(Request $request)
{
$id = $request->input('id');
$servicio = Servicio::find($id);
$output = array(
'id_usuario' => $servicio->id_usuario,
'id_cliente' => $servicio->id_cliente,
'referencia' => $servicio->referencia,
'tipo_equipo' => $servicio->tipo_equipo,
'tipo_servicio' => $servicio->tipo_servicio,
'id_reporte' => $servicio->id_reporte,
'imagen_inicio' => $servicio->imagen_inicio,
'imagen_fin' => $servicio->imagen_fin,
'pdf_reporte' => $servicio->pdf_reporte
);
echo json_encode($output);
}
这是我的脚本的代码：
$('#servicio_form').on('submit', function(event){
event.preventDefault();
var form_data = $(this).serialize();
$.ajax({
url:"{{ route('mis-servicios.postdata') }}",
method:"POST",
data:form_data,
dataType:"json",
success:function(data)
{
if(data.error.length > 0)
{
var error_html = '';
for(var count = 0; count < data.error.length; count++)
{
error_html += '<div class="alertaTables alert alert-danger">'+data.error[count]+'</div>';
}
$('#form_output').html(error_html);
window.setTimeout(function() {
$(".alert").fadeTo(500, 0).slideUp(500, function(){
$(this).remove();
});
}, 5000);
}
else
{
$('#form_output').html(data.success);
$('#mis-servicios_table').DataTable().ajax.reload();
window.setTimeout(function() {
$(".alert").fadeTo(500, 0).slideUp(500, function(){
$(this).remove();
});
}, 5000);
}
}
})
});
$(document).on('click', '.edit', function(){
var id = $(this).attr("id");
$.ajax({
url:"{{ route('mis-servicios.fetchdata') }}",
method:'get',
data:{id:id},
dataType:'json',
success:function(data)
{
$('#id_usuario').val(data.id_usuario);
$('#id_cliente').val(data.id_cliente);
$('#referencia').val(data.referencia);
$('#tipo_equipo').val(data.tipo_equipo);
$('#tipo_servicio').val(data.tipo_servicio);
$('#id_reporte').val(data.id_reporte);
$('#imagen_inicio').val(data.imagen_inicio);
$('#imagen_fin').val(data.imagen_fin);
$('#pdf_reporte').val(data.pdf_reporte);
$('#servicio_id').val(id);
$('#servicioModal').modal('show');
$('#action').val('Editar');
$('.modal-title').text('Editar Servicio');
$('#button_action').val('update');
}
})
});
这是我的blade.php的代码
<main class="content">
<div class="container-fluid p-0">
<h1 class="h3 mb-3">Mis Servicios</h1>
<br />
<table id="mis-servicios_table" class="table table-striped table-bordered dataTable" style="width:100%">
<thead>
<tr style="background-color: white;">
<th>Usuario</th>
<th>Cliente</th>
<th>Referencia</th>
<th>Equipo</th>
<th>Servicio</th>
<th>No. de Reporte</th>
<th>Fecha Inicio</th>
<th>Fecha Fin</th>
<th>Status</th>
<th>Acciones</th>
</tr>
</thead>
</table>
</div>
<div id="servicioModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<form method="post" id="servicio_form" enctype="multipart/form-data">
<div class="modal-header">
<h4 class="modal-title">Añadir Servicio</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
{{csrf_field()}}
<span id="form_output"></span>
<div class="form-group">
<label>Usuario</label>
<select name="id_usuario" id="id_usuario" class="form-control" disabled>
<option value="">Elige el Usuario</option>
@foreach($useres as $user)
<option value="{{ $user->id }}">{{ $user->name }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label>Cliente</label>
<select name="id_cliente" id="id_cliente" class="form-control" disabled>
<option value="">Elige el Cliente</option>
@foreach($nombreCliente as $nombreCliente)
<option value="{{ $nombreCliente->id }}">{{ $nombreCliente->nombre_cliente }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label>Referencia</label>
<input type="text" name="referencia" id="referencia" class="form-control" readonly/>
</div>
<div class="form-group">
<label>Tipo de Equipo</label>
<input type="text" name="tipo_equipo" id="tipo_equipo" class="form-control" readonly/>
</div>
<div class="form-group">
<label>Tipo de Servicio</label>
<input type="text" name="tipo_servicio" id="tipo_servicio" class="form-control" readonly/>
</div>
<div class="form-group">
<label>ID Reporte</label>
<input type="text" name="id_reporte" id="id_reporte" class="form-control" />
</div>
<div class="form-group">
<label>Imagen ID Equipo</label>
<input type="file" name="imagen_inicio" id="imagen_inicio" class="form-control" />
</div>
<div class="form-group">
<label>Imagen Servicio Terminado</label>
<input type="file" name="imagen_fin" id="imagen_fin" class="form-control" />
</div>
<div class="form-group">
<label>Reporte en PDF</label>
<input type="file" name="pdf_reporte" id="pdf_reporte" class="form-control" />
</div>
</div>
<div class="modal-footer">
<input type="hidden" name="servicio_id" id="servicio_id" value="" />
<input type="hidden" name="button_action" id="button_action" value="insert" />
<input type="submit" name="submit" id="action" value="Añadir" class="btn btn-info" />
<button id="cerrarModal" type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>
</form>
</div>
</div>
</div>
</main>
解决方案
它不允许您存储文件，因为文件没有到达服务器，因为您使用 AJAX 发出请求，通过 AJAX 发送文件试试这个：
$('#servicio_form').on('submit', function(event){
event.preventDefault();
// init formData and get files
let formData = new FormData($('#servicio_form')[0]);
let imagenInicio = $('#imagen_inicio')[0].files[0];
let imagenFin= $('#imagen_fin')[0].files[0];
let pdfReporte= $('#pdf_reporte')[0].files[0];
// append files to formData
formData.append('imagen_inicio', imagenInicio);
formData.append('imagen_fin', imagenFin);
formData.append('pdf_reporte', pdfReporte);
// in AJAX disable contentType, processData and cache
$.ajax({
url:"{{ route('mis-servicios.postdata') }}",
method:"POST",
dataType:"json",
data: formData, // change this and the following options
contentType: false,
processData: false,
cache: false,
success: function(data) {
// your code...
}
});
});
推荐阅读
- android - 如何注册 Android onBackPressed 按下？
- javascript - How do I refer to arguments of a function when the function is passed in as a parameter?
- python - 从架构中检索所有属性的列表（解析引用）
- javascript - 完整日历选择选项值以在日历下方呈现列表
- angular - 角度补丁值不起作用
- java - Indeterminate ProgressBar does not animate when part of a Dialog (JavaFX 10)
- rest - 反应休息呼叫赛车
- unity3d - 如何在 Destroy() 上播放声音
- swift - 硬编码 PPS 和 SPS 参数时，无法使用 VideoToolbox 解压缩 H.264 帧
- c - C：做一个方程只出现一次