文档介绍：该【miracle专题手册补充 】是由【幸福人生】上传分享，文档一共【30】页，该文档可以免费在线阅读，需要了解更多关于【miracle专题手册补充 】的内容，可以使用淘豆网的站内搜索功能，选择自己适合的文档，以下文字是截取该文章内的部分文字，如需要获得完整电子版，请下载此文档到您的设备，方便您编辑和打印。miracle专题手册补充Grid组件这个组件是经过精细优化,在速度上具有很大的优势,加载5000行数据只需要3秒,加载10000行数据只需要10秒。对比ExtJsGrid,后者虽然界面漂亮,但是下载体积和性能是其软肋。功能介绍Grid组件提供的功能有:点击标题排序定制列宽、是否显示支持序号列提供复选列鼠标调整列宽支持自定义行、列渲染器grid生成原理如下图所示,,但是启动tomcat之后可以在list页面查询得到该实体的数据展示列表,因此grid的实现不是在具体业务的list页面中完成的。<linkhref="/fldpdss/framework/script/webfx/columnlist/includes/"rel="stylesheet"/><scriptsrc="/fldpdss/framework/script/webfx/columnlist/includes/"></script> 该部分用来引入columnlist相关的脚本和样式,只有引入了这两个文件grid才能正常的实现并显示。varentityClass="";vargridColumnName=["id","名称","x坐标","y坐标","整备能力","能否调头","是否本务段","所属机务段","所在站","用途"];vargridColumnId=["id","name","xpos","ypos","capacity","canturnover","isbasicdepot","depotgroupId","stationId2","use"];vargridColumnAlias=["id","name","xpos","ypos","capacity","canturnover","isbasicdepot","depotgroupId","stationId2","use"];vargridColumnWidth=[0,100,0,0,100,100,100,100,100,100];vargridRowIdColumnId=["id"];vargridData=[ ["8","牡丹江",,,,"否","是√","牡丹江","1",], ["1","满洲里车间",,,,"否","是√","牡丹江","1",]];vargridOriginalData=[[,,,,,"0","1","2","1",],[,,,,,"0","1","2","1","0"]];entityClass是指当前的业务对应的javaBean实体,gridColumnName是指grid中每一列的显示名称,gridColumnId是指每一列在数据库中的字段名称,gridColumnAlias是指每一列的别名,gridColumnWidth指每一列的宽度,gridRowIdColumnId指主键名称,gridData和gridOriginalData是二维数组,gridOriginalData存放的是grid中被解析的数据的原值(如数据字典等数据库中保存的数据),gridData是在list页面中的grid显示的数据,是gridOriginalData中被解析后的数据,如果gridData中显示的数据不需要解析那么在gridOriginalData中该字段是空的。grid常用方法隐藏grid中复选框:=false;获得grid中某行某字段显示值:(row,col);获得grid中某行某字段原始值:getGridOriginalData(row,col);设置grid中某一列可以高亮选择:=true;Action中获得list页面中复选框选中的行id值:StringrowId=(request,form);String[]rowIds=(request,form);grid扩展grid扩展包括行扩展和列扩展,,这些代码要写在doAfterInitControl或者doBeforeInitControl中。扩展1:将性别是“男”的行背景颜色设置为暗红色在grid显示数据加载之后对航进行渲染,即在AfterInitControl方法中添加行渲染代码。functiondoAfterInitControl(){//设置行渲染器 ( function(eTr,row){ //获得本行的数据 varvalue=(row,'colName2); if(value&1){ ='myHightlight'; } } )}效果如下:扩展2:将地图上传日志中的列“上传时间”修改成连接,查看该车站的上传历史和上一个扩展一样,该需求也要写在AfterInitControl方法中,functiondoAfterInitControl(){//("updatedate",function(eTd,value,row,col){varstationid=getGridOriginalData(row,"stationid");="<ahref='#'onclick='openlog(\""+stationid+"\")'>"+value+"</a>";});}}//打开"上传地图历史查询"页面functionopenlog(){varstationid=$(stationid).value; varoptions={ name:"上传地图历史查询", resourceId:"上传地图历史查询", link:doGetRootPath()+'/gis/stationpropertylog/?retrieve=true&stationid='+encodeURI(stationid), reload:true, info:"上传地图历史查询" }; (options);}该扩展效果如下,点击上传时间的链接之后就会弹出该车站的上传地图历史查询扩展3:将列“车站名称”换成文本输入框的格式,functiondoBeforeInitControl(){("stationid", function(eTd,value,row,col){ ="<inputtype='text'size='6'value='"+value+"'>"; });}效果如下:Tree组件本节介绍树形控件,树形控件应用不是很广泛,开发难度也大一些。Miracle里应用的是改进的XTree控件,在实用性和效率方面做了很多支持。功能介绍Tree组件提供的功能有:指定根结点,仅显示根结点及其子节点支持复选框,并且支持级联选中父节点和子节点支持延迟加载节点,加载1000个节点也飞快支持Ajax加载节点支持仅展开第一层节点支持节点的更新应用实例制作一个专业树,用来展示不同专业下的课程在数据库中新建一个专业表specialtytree,结构如下:createtableSPECIALTYTREE(SPECIALTY_IDVARCHAR2(40)notnull,SPECIALTY_NAMEVARCHAR2(50),SPECIALTY_PARENT_IDVARCHAR2(40),CREATE_USER_IDVARCHAR2(40),CREATE_STATION_IDVARCHAR2(40),LOCK_VERSIONNUMBER)commentontableSPECIALTYTREEis'专业树';'专业ID';'专业名称';'上级专业';'创建人';'创建单位';'乐观锁';其中前三个字段“专业ID”“专业名称”“上级专业” BaseSingleTreeCRUDActionSupport<Specialtytree>将父类BaseSingleEntityCRUDActionSupport<Specialtytree>改为BaseSingleTreeCRUDActionSupport<Specialtytree>修改struts-bean-<beanname="/fldpdss/specialtytree/Specialtytree"parent="baseTreeAction"scope="request" class=""> <description>专业树action</description> <propertyname="entityManager"ref="specialtytreeManager"/> <!-- <propertyname="treeRootId"value="root"/> --> <propertyname="treeIdPropName"value="specialtyId"/> <propertyname="treeTextPropName"value="specialtyName"/> <propertyname="treeParentIdPropName"value="specialtyParentId"/> </bean>将<bean>中的parent属性从baseCRUDAction改为baseTreeAction,并且添加蓝色字体的property属性,其中treeRootId是可选的修改struts-config-<forwardname="queryFrame" path="/framework/layout/tiles/crud/tree/"/>将forward中queryFrame的path路径从/framework/layout/tiles/crud/single/.jsp<tiles:insertdefinition=""flush="true"><tiles:insertdefinition=""flush="true"><%***@pageimport=".*"%><%***@page import=""%><%--businesslogic--%><%Listlist=();(通过获得要展示的数据) Stringcheckbox="Y";(设置是否显示复选框)%><script> varnodes=[<%if(list!=null){ for(Iterator<Specialtytree>it=();();){ Specialtytreedata=(); %> ['<%=()%>', '<%=()%>', '<%=()==null?"":()%>', '','','<%=checkbox%>','',''], <%} }%>];</script>效果:如果在struts-bean-(某条记录的id),那么根节点就会变成该节点的名称。如果不想显示复选框,="Y"改成checkbox="N"。