关于bootstrap fileinput使用form提交单个删除后提交到后台所有文件都被清空了（在线等急急急）

[twx211553]

大神们好：
需求描述：页面选择多张图片后，支持单个删除，使用form提交文件能和表单一起提交到后台
问题描述：js初始化不设置uploadUrl属性，图片右下角不会出现删除图标（所以写了个虚假url，目的是显示删除图标）
1.如果不点击图片的单个删除，直接form提交到后台文件数正常。
2.如果点击了单个图片删除，页面效果正常，不过提交到后台的文件都被清空了。
3.如果先选3张，删除1张，再选1张，页面上面显示3张（正常），但是提交到后台只有删除之后再次选择的那1张
4.如果使用异步提交图片，不会出现上述问题，但是因项目原因，需使用form提交
求解方案：fileinput form同步提交能否在单个删除后提交到后台文件数量正常

这是初始化页面html多文件上传

<div class="form-group">
 <label class="col-sm-3 control-label">类目图片：</label>
   <div class="col-sm-8">
   <input id="catTypeUrls" name="catTypeUrls" type="file" class="file-loading" accept="image/*" multiple>
  </div>
 </div>   

这是js初始化组件（uploadUrl随便写的，因为加了这个标签图片上面的单个删除才会显示）

$("#catTypeUrls").fileinput({
		uploadUrl: "upload",
		uploadAsync: false, //同步上传  
		showUpload : false,
		showRemove : false,
		autoReplace: false,
	    maxFileCount: 10,
		language : 'zh',
		showCaption: false,
		enctype: 'multipart/form-data',
	    allowedFileExtensions: ["jpg", "png", "gif"],
	    minImageWidth: 50,
	    minImageHeight: 50,
	    maxFileSize : 2000,
	    overwriteInitial: false,//不覆盖已存在的图片  
	    layoutTemplates:{
	    	actionUpload:''    //设置为空可去掉上传按钮
	    	//actionDelete:''  //设置为空可去掉删除按钮
	    }
	});

这是页面显示效果

[twx211553]

调试源码发现，使用异步提交时候调用了源码的upload函数，而使用form提交没有调用该函数，该函数做了一系列的处理 或者有大神知道form提交的时候取fileinput的数据是取自哪里（函数）吗？

[斯洛文尼亚旅游]

引用 2 楼 u013931282 的回复:

大神，我也遇到了一样的问题，请问你解决了吗？卡了2天了谢大神了！

这个插件直接form提交时提交原始的file那个dom对象，只能得到最后一次选择的文件，因为都是同一个file，选择多次值保存最后一次选择的。而ajax提交的是FormData，每次file 那个dom change都会添加内容到FormData中，删除也会从FormData中删除 操作的的不是同一个file对象，一定要表单提交可以参考这个，也是批量上传的：多文件选择上传jquery插件，居于表单提交的

[想飞的超人儿]

大神，我也遇到了一样的问题，请问你解决了吗？卡了2天了谢大神了！

[grass521_]

你好 楼主 上传成功之后 删除的时候 如何跟缩略图和后台挂钩 ？

[啥也不会哎]

最后怎么解决的啊急急急大哥

[啥也不会哎]

最后怎么解决的老哥，领导问我了，我还没搞出来，太难了