前言:

现有的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. C# 连接池开发,多连接高效应用开发,多连接自动维护管理。

    本文将使用一个Github开源的组件库技术来实现连接池的操作,应用于一些情况下的频繁的网络连接操作. github地址:https://github.com/dathlin/HslCommunicat ...

  2. Day 1: ASP.NET and JavaScript Jan.16th Trying

    ASP.NET has its own named controls(tags) corresponding to that in an HTML document, such as <asp: ...

  3. 【转】20-TCP 协议(滑动窗口——基础)

    https://blog.csdn.net/q1007729991/article/details/70142341 相信大家都遇到过这样的场景: 同学 Luffy 给你打电话,让你记下一串手机号码, ...

  4. ffmpeg 视频 转 gif

    将视频 MP4 转化为 GIF ffmpeg -i small.mp4 small.gif 转化视频中的一部分为 GIF ffmpeg -t -ss :: -i small.webm small-cl ...

  5. ggplot2 multiply graphs on one figure

    library(ggplot2)library(grid)grid.newpage()pushViewport(viewport(layout = grid.layout(1,2)))vplayout ...

  6. MySQL数据库-pymysql模块操作数据库

    pymysql模块是python操作数据库的一个模块 connect()创建数据库链接,参数是连接数据库需要的连接参数使用方式: 模块名称.connect() 参数: host=数据库ip port= ...

  7. 第一章 HTML+CSS(中)

    4.域元素(form表单.textarea文本域.fieldset域集合.input使用) 案例 表单 用户名: 密码: 昵称: 你喜欢的水果有? 苹果 黄瓜 香蕉 请选择性别 男 女 请选择你要的网 ...

  8. c# 仿微信二维码生成

    /// <summary> /// 生成二维码. /// </summary> /// <param name="data">需要添加进去的文本 ...

  9. Linux环境安装PostgreSQL-10.1

    转载自:https://www.cnblogs.com/LinBug/p/8082790.html Linux环境安装PostgreSQL-10.1   环境及资源 Linux版本:CentOS re ...

  10. E212: Can't open file for writing Press ENTER or type command to continue

    E212: Can't open file for writing Press ENTER or type command to continue 出现这个错误的原因可能有两个: 1.当前用户的权限不 ...