前言:

现有的uploadify上传是基于swf的,随着H5的普及,flash即将退出历史舞台,JEECG本着与时俱进的原则,将全面升级JEECG系统中的上传功能,采用新式上传插件plupload,此插件上传支持多种模式html5,flash,silverlight,html4,可通过配置实现优先模式,对于新版主流浏览器均可采用H5,对于不支持H5的低版本IE浏览器可走flash模式。以下讲解JEECG Online的升级。

升级步骤(细节描述可忽略)

1.下载升级文件

链接:https://pan.baidu.com/s/1SJXzPeN7qE4O6KB0O5qi2w 密码:z5eh

2.【新增文件】

增加JS/css,将plupload文件夹直接拷贝到src/main/webapp/plug-in/下

3.【修改文件】

拷贝Map.js至src/main/webapp/plug-in/tools/下,覆盖更新。

4.【修改文件】

拷贝FormHtmlUtil.java至src/main/java/org/jeecgframework/web/cgform/common/下,覆盖更新。

(细节描述:在FormHtmlUtil类中新增一个方法getFilePluploadFormHtml 详细见升级文件,并找到getFormHTML方法,修改文件类型加载的页面代码的方法为getFilePluploadFormHtml,如下)

······
}else if(cgFormFieldEntity.getShowType().equals("file")){
html=getFilePluploadFormHtml(cgFormFieldEntity);//获取实例化plupload组件的页面代码
}
······

  

5.【修改文件】

拷贝CgFormBuildController.java至src/main/java/org/jeecgframework/web/cgform/controller/build/下,覆盖更新。

(细节描述:在CgFormBuildController类中找到getHtmlHead方法,注掉老版JS,替换成新版,修改如下)

//sb.append("<script type=\"text/javascript\" src=\""+basePath+"/plug-in/uploadify/jquery.uploadify-3.1.js\"></script>");
sb.append("<script type=\"text/javascript\" src=\""+basePath+"/plug-in/plupload/plupload.full.min.js\"></script>");

6.拷贝CgformFtlController.java至src/main/java/org/jeecgframework/web/cgform/controller/cgformftl/下,覆盖更新。

(细节描述:在CgformFtlController类中找到addorupdate方法,注掉老版JS,替换成新版,修改如下)

//sb.append("<script type=\"text/javascript\" src=\"${basePath}/plug-in/uploadify/jquery.uploadify-3.1.js\"></script>");
sb.append("<script type=\"text/javascript\" src=\"${basePath}/plug-in/plupload/plupload.full.min.js\"></script>");

  

7.拷贝文件夹moblieCommon001、moblieCommon002、ui至src/main/resources/online/template/下,覆盖更新。

细节描述:这个步骤修改的有

a.  新增宏文件src/main/resources/online/template/ui/uploadPltag.ftl,详细见升级文件。

b.  修改tag宏文件src/main/resources/online/template/ui/tag.ftl:

<#include "/online/template/ui/treetag.ftl"/>
<#include "/online/template/ui/uploadPltag.ftl"/>

  

c.  模板文件中的JS替换,即在src/main/resources/online/template下搜索 “jquery.uploadify-3.1.js” 若页面有,需要将此JS路径替换成plug-in/plupload/plupload.full.min.js,并且额外增加一个JS引入:

<script type="text/javascript" src="plug-in/tools/Map.js"></script>

例如:搜索到文件src/main/resources/online/template/ui/basetag.ftl内有“jquery.uploadify-3.1.js”,代码如下:

<#if hasFile==true>
<link rel="stylesheet" href="${webRootf!''}plug-in/uploadify/css/uploadify.css" type="text/css"></link>
<script type="text/javascript" src="${webRootf!''}plug-in/uploadify/jquery.uploadify-3.1.js"></script>
</#if>

  

现需要将其改成:

<#if hasFile==true>
<link rel="stylesheet" href="${webRootf!''}plug-in/uploadify/css/uploadify.css" type="text/css"></link>
<script type="text/javascript" src="${webRootf!''}plug-in/plupload/plupload.full.min.js"></script>
<script type="text/javascript" src="${webRootf!''}plug-in/tools/Map.js"></script>
</#if>

  

8.执行升级SQL

update cgform_ftl SET FTL_CONTENT = replace(FTL_CONTENT, 'plug-in/uploadify/jquery.uploadify-3.1.js', 'plug-in/plupload/plupload.full.min.js');

  

JEECG 上传插件升级-Online的更多相关文章

  1. JEECG 上传插件升级-标签

    前言: 现有的uploadify上传是基于swf的,随着H5的普及,flash即将退出历史舞台,JEECG团队本着与时俱进的原则,将全面升级JEECG系统中的上传功能,采用新式上传插件plupload ...

  2. JEECG 上传插件升级-代码生成器

    前言: 现有的uploadify上传是基于swf的,随着H5的普及,flash即将退出历史舞台,JEECG本着与时俱进的原则,将全面升级JEECG系统中的上传功能,采用新式上传插件plupload,此 ...

  3. 大文件上传插件webupload插件

    版权所有 2009-2018荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com/ 产品首页:http://www.ncmem.com/webapp/up6.2/in ...

  4. 强大的flash头像上传插件(支持旋转、拖拽、剪裁、生成缩略图等)

    今天介绍的这款flash上传头像功能非常强大,支持php,asp,jsp,asp.net 调用 头像剪裁,预览组件插件. 本组件需要安装Flash Player后才可使用,请从http://dl.pc ...

  5. 强大的支持多文件上传的jQuery文件上传插件Uploadify

    支持多文件上传的jQuery文件上传插件Uploadify,目前此插件有两种版本即Flash版本和HTML5版本,对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持Fla ...

  6. jQuery文件上传插件Uploadify(转)

    一款基于flash的文件上传,有进度条和支持大文件上传,且可以多文件上传队列. 这款在flash的基础上增加了html5的支持,所以在移动端也可以使用. 由于官方提供的版本是flash免费,html5 ...

  7. 基于Metronic的Bootstrap开发框架经验总结(5)--Bootstrap文件上传插件File Input的使用

    Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使用的时候,也是一步一个脚印一样摸着石头过河,这个控件在界面呈现上,叫我之前使用过的Uploadi ...

  8. JQuery上传插件Uploadify使用详解

    本文转载http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html Uploadify是JQuery的一个上传插件,实现的效果非常不错 ...

  9. CI框架如何在主目录application目录之外使用uploadify上传插件和bootstrap前端框架:

    19:29 2016/3/10CI框架如何在主目录application目录之外使用uploadify上传插件和bootstrap前端框架:项目主路径:F:\wamp\www\graduationPr ...

随机推荐

  1. traceroute命令初探

    一.学习目标 了解traceroute基本概念 了解traceroute工作原理及详细过程 熟悉traceroute常用命令 一些注意点 二.traceroute基本概念 traceroute (Wi ...

  2. python自学第12天 模块定义,导入,内置模块

    1.定义模块:用来从逻辑上组织python代码(实现一个功能),本质是.py结尾的python 包:本质就是一个目录(必须带有一个_init_.py文件)2.导入方法import module_nam ...

  3. 基于Verilog的串口接收程序

    一.模块框图及基本思路 detect_module:检测输入引脚的下降沿,以此判断一帧数据的开始 rx_bps_module:波特率时钟产生模块 rx_control_module:串口接收的核心控制 ...

  4. leetcode题解2. Add Two Numbers

    题目: You are given two non-empty linked lists representing two non-negative integers. The digits are ...

  5. Xcode 运行时配置

    有时候,我们的app在测试时需要连接到一个testing服务器,在打包为企业证书的app时又需要连接到另一个ad hoc 服务器,或者我们想企业证书打包的app和debug模式打包的app有不同的AP ...

  6. jQuery-2.DOM---jQuery遍历

    jQuery遍历之children()方法 jQuery是一个合集对象,如果想快速查找合集里面的第一级子元素,此时可以用children()方法.这里需要注意:.children(selector) ...

  7. vue安装过程

    我们3个安装参考的博客地址 http://blog.qianduanchina.cn/post/596c5bb27838a71273eb4da3 http://blog.csdn.net/unamat ...

  8. 编译Linux-4.15.1内核时遇到:“error : openssl/bio.h :No such file or folder”

    如题: scripts/extract-cert.c::: fatal error: openssl/bio.h: No such file or directory compilation term ...

  9. 使用golang 编写postgresql 扩展

      postgresql 的扩展可以帮助我们做好多强大的事情,支持的开发语言有lua.perl.java.js.c 社区有人开发了一个可以基于golang开发pg 扩展的项目,使用起来很方便,同时为我 ...

  10. Flask-ORM-数据库的对象关系映射模型-备忘

    ORM对象关系映射模型的特点: 优点 : 只需要面向对象编程, 不需要面向数据库编写代码. 对数据库的操作都转化成对类属性和方法的操作. 不用编写各种数据库的sql语句. 实现了数据模型与数据库的解耦 ...