如何将多个文件从jqGrid的laravel上传
问题描述:
这里是我下面的代码:如何将多个文件从jqGrid的laravel上传
let colNames = ['ID', 'Image', 'Title', 'Description'];
let colModel = [
{name: 'id', index: 'id', width: 30, editable: true, editoptions: {size: "30", maxlength: "50"}},
{
name: 'image',
index: 'image',
align: 'left',
editable: true,
edittype: 'file',
editoptions: {
multiple: true,
accept: ".jpg,.png,.jpeg",
enctype: "multipart/form-data"
},
width: 210,
align: 'center',
formatter: imageFormatter,
search: false
},
{name: 'image_title', index: 'image_title', width: 150, editable: true, editoptions: {size: "30", maxlength: "50"}},
{name: 'image_description', index: 'image_description', width: 150, editable: true, editoptions: {size: "30", maxlength: "50"}}
}
];
我使用ajaxFileUpload这里是我的代码上传相同:
afterSubmit: function (response) {
if(response.responseJSON){
$.ajaxFileUpload({
url: fileuploadUrl,
secureuri:false,
fileElementId:'image',
dataType: 'json',
success: function (data, status) {
alert("Upload Complete.");
}
});
}
return [true];
}
},
这fileElementId
指的是image
。 image
只被挑选一次。试图将图像分配给images[]
,就像我们从纯HTML中那样分配图像。但仍然没有运气作为ajaxFileUpload.js抛出错误为images[]
找不到id。
任何帮助将不胜感激。
答
afterSubmit: function (response) {
if(response.responseJSON){
// Simple change here
$('#image').attr('name', 'images[]');
$.ajax({
url: 'upload_files.php', // your php upload script
dataType: 'text', // what to expect back from the php upload script
cache: false,
contentType: false,
processData: false,
data: {
rowId: rowId,
_token: $('meta[name="csrf-token"]').attr('content')
},
fileElementId:'image',
type: 'post',
success: function (response) {
alert("Upload Complete.");
},
error: function (response) {
// handle any errors
}
});
}
return [true];
}
As jqgrid dynamically creates id and name, for multiple file uploads, we need array of name. Hence dynamically changed to array of name which internally handles everything in the backend.
答
你可以尝试滚动自己的,像(未测试):
afterSubmit: function (response) {
if(response.responseJSON){
var form_data = new FormData();
var count = document.getElementById('image').files.length; // assuming your file input names is image
for (var x = 0; x < count; x++) {
form_data.append("files[]", document.getElementById('image').files[x]);
}
$.ajax({
url: 'upload_files.php', // your php upload script
dataType: 'text', // what to expect back from the php upload script
cache: false,
contentType: false,
processData: false,
data: form_data, // data created above
type: 'post',
success: function (response) {
alert("Upload Complete.");
},
error: function (response) {
// handle any errors
}
});
}
return [true];
}
...
然后,你可以访问你的PHP上传脚本文件与$_FILES['files']
否则,你可以使用插件像jQuery File Upload
看来你使用从[phpletter(HTTP插件://www.php letter.com/Our-Projects/AjaxFileUpload/)。在这种情况下,我需要问哪个版本的jQuery被使用? ajaxFileUpload是非常老的插件,它不能用最新的jQuery。您可能需要包含迁移插件才能使其工作。我不确定这个插件支持多个文件上传。只是为了测试。尝试上传只有一个文件 –
单个文件上传工作正常,但不是多个。是的插件似乎已经过时了,对于支持多个上传的最新jQuery的任何建议? – Mithun