以下是我的ajax代码和前端代码:
<form id="file-upload-form" method="POST" action="/admin/upload/file"
class="form-horizontal" enctype="multipart/form-data">
<input type="hidden" id="file-upload" name="_token" value="{{ csrf_token() }}">
<input type="hidden" id="file-upload" name="folder" value="{{ $folder }}">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×
</button>
<h4 class="modal-title">上传新的文件</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="file" class="col-sm-3 control-label">
文件
</label>
<div class="col-sm-8" id="photo1">
<input type="file" id="file" name="file" >
</div>
</div>
<div class="form-group">
<label for="file_name" class="col-sm-3 control-label">
选择上传到的文件夹/命名并上传或直接命名并上传
</label>
<div class="col-sm-4">
<input type="text" id="file_name" name="file_name"
class="form-control">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
取消
</button>
<button type="button" class="btn btn-default" onclick="uploadPhoto()">
AJAX上传
</button>
<button type="submit" class="btn btn-primary" onclick="handle_upload_image()" >
上传文件
</button>
</div>
</form>
其中上传文件按钮是正常的submit按钮,AJAX上传是AJAX上传按钮,下面是AJAX的JS代码:
<script>
// todo.. 可优化成无需传js参数即可上传
//AJAX上传base64
function uploadPhoto() {
var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("file-upload-form").submit()
}
}
xmlhttp.open("POST","",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send();
}
</script>
就是要通过路由识别/admin/upload/file这个路径来把这个form的信息跟那个正常的上传文件按钮一样上传给控制器处理掉,目前就是500错误,(不用AJAX的那个没有问题的,即后端代码没问题的),所以问题是这个AJAX代码及具体该怎么写才对。
接受建议改成这样了,还是不行,求问哪里错了
function uploadPhoto() {
var v = '查看内容是否加载:';
const file = $("#file").val();
var file_upload = $("#file-upload").val();
var file_name = $("#file_name").val();
var formData = new FormData($("#file-upload-form"));
console.log(v+file+'___'+file_upload+'___'+file_name);
$.ajax({
url:"/admin/upload/file",
contentType: 'application/x-www-form-urlencoded',
type:"POST",
data:formData,
datatype:"",
processData: false,
success:function(){
$('#page_image').html($('#file_name').text());
}
});
}
4 回答
![?](http://img1.sycdn.imooc.com/533e4c7b00013f3c02400205-100-100.jpg)
心有法竹
TA贡献1866条经验 获得超5个赞
因为你要上传文件,所以 contentType: "application/json; charset=utf-8",
是不正确的。
改成这样
$.ajax({
url:"/admin/upload/file",
processData: false,
contentType: false,
type:"POST",
data:formData,
success:function(){
$('#page_image').html($('#file_name').text());
}
});
- 4 回答
- 0 关注
- 425 浏览
添加回答
举报
0/150
提交
取消