我是jquery和dropzone的新手。
我有一个与dropzone.js有关的问题。我必须发送表单数据(如custome_name、id、DOB等)以及在dropzone中丢弃的图像文件。
如何使用AJAX在单击按钮事件中将数据字符串和dropzone文件一起发送到PHP脚本?
提前谢谢。你的小小支持将是非常可观的。
根据Dropzone.js文档的提示部分,
Dropzone将提交您在Dropzone表单中的任何隐藏字段
所以这可能是你的一个选择。或者,您也可以使用params
选项指定额外的数据,该选项可能看起来像:
Dropzone.options.myAwesomeDropzone = {
paramName: "file", // The name that will be used to transfer the file
maxFilesize: 2, // MB
params: {
customer_name: 'Jeffrey Lebowski',
dob: '1949-11-20',
...
},
...
};
它没有很好的记录,所以我只是猜测Dropzone.options
方法将如何工作。
我来晚了,但如果有人有同样的问题,我会以完全不同的方式解决。
我只为用户的用户体验使用dropzone,并为我的网站提供拖放功能,但我想在一个按钮中一次性提交所有信息。
首先,我初始化了我的dropzone区域,在我的例子中,我使用了div,而不是表单来包含dropzone。
$animalImage = new Dropzone('div#animalImage', {
// url: '/file/post',
addRemoveLinks: true,
//thumbnailWidth: "100",
//thumbnailHeight: "100",
uploadMultiple: true,
autoProcessQueue: false,
parallelUploads: 4,
maxFilesize: 4,
maxFiles: 4,
maxfilesexceeded: function (files) {
this.removeAllFiles();
this.addFile(files);
},
acceptedFiles: '.png,.jpg,.jpeg',
dictDefaultMessage: '<span class="text-center"><i class="fa fa-cloud-upload text-info" style="margin-right:5px"></i>' +
'Arrastra una imagen <span class="font-xs">para guardar</span></span><span>  ' + '<h4 class="display-inline"> (O Click Aquí)</h4></span>',
//dictResponseError: 'Error al subir imagen',
dictRemoveFile: '<i class="fa fa-times-circle" style="font-weight: 900; cursor:pointer;"></i>'
});
然后我声明和数组(这是我希望在控制器和模型中接收它的方式)提取了保存函数中的所有文件,dropzone允许您访问每个图像的编译数据,并将其添加到我的数组图像中。
images = [];
for (var i = 0; i < $animalImage.files.length; i++) {
images.push($animalImage.files[i]);
}
最后我把它添加到我的json对象中。
animal.Pictures = images;
在我的模型结束时,我收到了所有的信息,包括我的表格和我所期望的图像的dropzone数组。
希望能有所帮助。