extjs5.1多文件上传控件

items: [{
                            itemId: 'htlb',
                            height: 160,
                            xtype: 'extMutilUploadPanel',
                            uploadConfig : {
                                url : $GLOBAL.CONTEXT_PATH + "/saveArchivements",
                                downloadUrl : $GLOBAL.CONTEXT_PATH + "/download"
                            },
                            storeLoadUrl : $GLOBAL.CONTEXT_PATH  + $GLOBAL.REQUEST.PROJECTS['getContractList'],
                            listeners : {
                                'FilesUploadComplete' : function(fileStore) {
                                    var idsArray = new Array();
                                    for (var index = 0; index < fileStore.getCount(); index++) {
                                        var record = fileStore.getAt(index);
                                        idsArray.push(record.get('id'));
                                    }
                                    var htlb = idsArray.join(",");
                                    _this.down('hidden[name="xmht"]').setValue(htlb);
                                }
                            }
                        }]

以上是用例代码要引入的文件有： '/styles/extjs/${extVersion }/js/plugins/ExtjsMutilUploader/plupload/plupload.full.min', '/styles/extjs/${extVersion }/js/plugins/ExtjsMutilUploader/ExtMutilUploadPanel', 这几天生病，没有更新过BLOG，所以这个例子也是从以前的代码中抄出来的，控件在附件中，下回去就可以用。

上传到后文件上传到后台后，前台将对文件自动生成一个uuid，可以通过store取到，然后保存就可以。

后台代码：

/**
     * 保存或更新上传文件
     *
     * @return
     * @author xiaomingyang
     * Created On 2016年7月24日，21时38分
     */
    @Before(SysLogInterceptor.class)
    @LoggedAs("保存或更新上传文件")
    public void saveArchivements() throws NestedTransactionHelpException {
        Map<String, Object> jsonMap = new HashMap<String, Object>();
        try {
            UploadFile uploadFile = this.getFile();
            if (uploadFile == null) {
                jsonMap.put("ok", true);
            }
            String fileName = uploadFile.getFileName();
            String contentType = uploadFile.getContentType();
            File upFile = uploadFile.getFile();
            Long fileSize = upFile.length();
            String saveFileName = StringUtils.getUUIDKey();
            FileUtils.moveFile(upFile, new File(saveFilePath + File.separator + saveFileName));
            EtmFiles etmFile = new EtmFiles();
            etmFile.set("id", StringUtils.getUUIDKey());
            etmFile.set("FILENAME", fileName);
            etmFile.set("FILESIZE", fileSize);
            etmFile.set("FILETYPE", contentType);
            etmFile.set("FILESTORAGEPATH", saveFilePath);
            etmFile.set("FILESTORAGENAME", saveFileName);
            etmFile.set("CREATETIME", DateUtils.getTimeStamp(new Date()));
            etmFile.set("UPLOADERID", ShiroUtils.getUserId());
            etmFile.save();
            jsonMap.put("id", etmFile.get("id"));
            jsonMap.put("ok", true);
            jsonMap.put("success", true);
            renderJson(jsonMap);
        } catch (Exception e) {
            log.error(e.getMessage());
            jsonMap.put("success", false);
            jsonMap.put("ok", true);
            jsonMap.put("msg", e.getMessage());
            renderJson(jsonMap);
            throw new NestedTransactionHelpException(e.getMessage());
        }
    }

这两天人病歪歪的，就不多写了，要用的自己看一看例子，想一下，看下源码就知道了，源码很简单的

extjs5.1多文件上传控件

猜你喜欢