当使用DWR调用Extjs的fileuploadfield 来做文件上传时,发现第一次调用可以正常执行,但不刷新页面的情况下,第二次调用就会出错。研究了DWR的源码,发现,每次调用DWR时,如果DWR发现您传的参数是个file类型的Input, dwr就会新建一个form,并且把你要上传的file input拿到他的form里去提交。同时,为了不影响页面,dwr会先把你传给他的file input 克隆一份,放在你原来的位置。正常情况下,这是没有问题的,可如果使用EXT的fileuploadfield, 问题就来了,ext的fileuploadfield实际上是一个普通的text input field和一个按钮,盖住了一个真正的fileinput, 这个真正的file input 会存在 fileuploadfield的fileInput域里,当dwr做了偷天换日的操作后,Ext就找不到自己的 fileInput了。
说了半天怎么解决呢?简单,这个事情不要让dwr做,我们自己来做,就可以了,找到dwr的engine.js, (在dwr.jar 的 org\directwebremoting\ 下面),把1808行的
var clone =value.cloneNode(true);
和 1812行的
value.parentNode.insertBefore(clone,value);
删掉(或者注释掉),重新打包的dwr.jar里
在每次调用文件上传的函数前,自己做相应的处理。类似以下的例子:
var filefield = form.findField(‘myuploadfield’);
var fileInputDom =filefield.fileInput.dom;
filefield.fileInput.dom= fileInputDom.cloneNode(true);
fileInputDom.parentNode.insertBefore(filefield.fileInput.dom,fileInputDom);
myfileService.uploadFile(fileInputDom, otherParams,callBackFunc(){ alert(‘upload ok’)});