Question

我想在dropzone上删除文件时更改文件名。

＆＃13;

Dropzone.autoDiscover = false;

  var myDropzone = new Dropzone("#pop");
  myDropzone.on("addedfile", function(file) {


  });

  myDropzone.on("removedfile",function(file){
  	$.ajax({
				url: "delete.php",
				type: "POST",
				data: { 'name': file.name}
				});
 });

myDropzone.on("sending", function(file, xhr, formData) {
			console.log(file);
	 console.log(xhr);console.log(formData);
  	file.uniqueName = new Date().getTime() +"_" + file.name;
		formData.append("unicname",  file.uniqueName);
    $("#pop").append("<input type='hidden' name='hidname' id='hidname' value="+file.uniqueName+">");
    xhr.response('unival='+file.uniqueName);
    console.log(xhr);console.log(formData);
    
      console.log(file);
  });

Dropzone.options.myDropzone = {
 	
 	   paramName: "file",
  uploadMultiple: true,
    init: function() {
    	 
    	
        thisDropzone = this;
   <!-- 4 -->
        
        $.getJSON('upload.php', function(data) {
 			
            <!-- 5 -->
            $.each(data, function(key,value){
                 
                var mockFile = { name: value.name, size: value.size };
                
                myDropzone.options.addedfile.call(myDropzone, mockFile);
 
                myDropzone.options.thumbnail.call(myDropzone, mockFile, "upload/"+value.name);
                 
            });
             
        });
    },

   success: function(file, response){
                
            }

   
};

＆＃13;

已经尝试过以下代码但不起作用。值不会附加到表单数据。对于变量文件的更改，无法在您定义的任何地方访问dropzone.js。 Dropzone.js

＆＃13;

myDropzone.on("sending", function(file, xhr, formData) {
			console.log(file);
	 console.log(xhr);console.log(formData);
  	file.uniqueName = new Date().getTime() +"_" + file.name;
		formData.append("unicname",  file.uniqueName);
    $("#pop").append("<input type='hidden' name='hidname' id='hidname' value="+file.uniqueName+">");
    xhr.response('unival='+file.uniqueName);
    console.log(xhr);console.log(formData);
    
      console.log(file);
  });

＆＃13;

解决方案似乎都没有效果。基本上我想将文件保存到指定给服务器的特定文件名。

Answer 1

从技术上讲，您可以在上传文件后更改缩略图fileName，我认为dropzone应该与您的数据表单分开，一旦您上传文件，服务器将返回文件名。并且您可以在数据表单中使用此文件名设置隐藏的输入值，然后最终提交数据表单。代码如下：

<div id="pop">

</div>
<form id="data-form">
    <input type="hidden" name="fileName">
    <input type="submit" name="submit" value="submit">
</form>
<script>
    var dropzone = new Dropzone("#pop");
    dropzone.on("success",function(file,response){
        var fileName = response.data.fileName //server return fileName
        $('input[name="fileName"]').val(fileName);
        var dataUrl = response.data.fileUrl;
        file.name = fileName //change thumbnail file name
        this.emit("thumbnail",file,dataUrl);//draw thumbnail
    });

</script>

Answer 2

你还需要跟随css来使用js代码来实现你的结果：

.dz-preview .dz-filename{display:none}
.dz-preview.dz-success .dz-filename{display:block}

在上传dropzone之前更改文件名

2 个答案: