display:table表格合并单元格
直接上代码:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/commons/include/html_doctype.html" %>
<html>
<head>
<title>补贴项目属性管理</title>
<%@include file="/commons/include/get.jsp" %>
<script type="text/javascript">
function fixRowspan() {
var tb = document.getElementById("projectPropertyItem");
var row_span_num = 1;
var first_row_title = "";
var first_row_obj = null;
for ( var i = 1; i < tb.rows.length; i++) {
var first_new_row_title = tb.rows[i].cells[0].innerHTML;
if (first_row_title != "" && first_row_title == first_new_row_title) {
tb.rows[i].deleteCell(0);
row_span_num++;
first_row_obj.setAttribute("rowSpan", row_span_num);
first_row_obj.innerHTML = first_row_title.replace("/", "<br/>");
} else {
if (first_row_title != "") {
first_row_obj.setAttribute("rowSpan", row_span_num);
first_row_obj.innerHTML = first_row_title.replace("/", "<br/>");
row_span_num = 1;
}
first_row_obj = tb.rows[i].cells[0];
first_row_title = first_new_row_title;
}
} }
</script>
</head>
<body onload="fixRowspan()">
<div class="panel">
<div class="panel-top">
<div class="tbar-title">
<span class="tbar-label">补贴项目属性管理列表</span>
</div>
<div class="panel-toolbar">
<div class="toolBar">
<div class="group"><a class="link search" id="btnSearch"><span></span>查询</a></div>
<div class="l-bar-separator"></div>
</div>
</div>
<div class="panel-search">
<form id="searchForm" method="post" action="list.ht">
<div class="row">
<span class="label">补贴项目:</span><!-- <input type="text" name="Q_projectId_SL" class="inputText" /> -->
<select name="Q_projectId_S" style="width:20% !important;" class="inputText">
<option value="">---请选择---</option>
<c:forEach items="${projectList }" var="project">
<option value="${project.id }" <c:if test="${param.Q_projectId_S eq project.id}">selected="selected"</c:if>>${project.projectName }</option>
</c:forEach>
</select>
</div>
</form>
</div>
</div>
<div class="panel-body">
<display:table name="projectPropertyList" id="projectPropertyItem" requestURI="list.ht" sort="external" cellpadding="1" cellspacing="1" class="table-grid">
<display:column property="projectName" title="项目名称" style="text-align:center;" sortName="PROJECT_NAME">
</display:column>
<display:column property="propName" title="属性名称" sortName="PROP_NAME" style="text-align:center;" ></display:column>
<display:column title="数据类型" style="text-align:center;" sortName="DATA_TYPE">
<c:forEach items="${Dictionary.DATA_TYPE }" var="item">
<c:if test="${projectPropertyItem.dataType eq item.itemValue }" >${item.itemName }</c:if>
</c:forEach>
</display:column>
<display:column title="属性类型" style="text-align:center;" sortName="PROP_TYPE">
<c:forEach items="${Dictionary.PROPERTY_TYPE}" var="item">
<c:if test="${projectPropertyItem.propType eq item.itemValue }">${item.itemName }</c:if>
</c:forEach>
</display:column>
<display:column title="计算单位" style="text-align:center;" sortName="COUNT_UNIT">
<c:forEach items="${Dictionary.COMPUTING_UNIT}" var="item">
<c:if test="${projectPropertyItem.countUnit eq item.itemValue }">${item.itemName }</c:if>
</c:forEach>
</display:column>
<display:column property="createUserName" title="创建人" style="text-align:center;" sortName="CREATE_BY"></display:column>
<display:column title="创建时间" style="text-align:center;" sortName="CREATE_TIME">
<fmt:formatDate value="${projectPropertyItem.createTime}" pattern="yyyy-MM-dd"/>
</display:column>
<display:column title="管理" media="html">
<c:if test="${project.state eq 'NOT_FINISH'}">
<a href="del.ht?id=${projectPropertyItem.id}" class="link del">删除</a>
<a href="edit.ht?id=${projectPropertyItem.id}" class="link edit">编辑</a>
</c:if>
<a href="get.ht?id=${projectPropertyItem.id}" class="link detail">明细</a>
</display:column>
</display:table>
<ksource:paging tableId="projectPropertyItem"/>
</div><!-- end of panel-body -->
</div> <!-- end of panel -->
</body>
</html>
效果图:

display:table表格合并单元格的更多相关文章
- jquery操作表格 合并单元格
jquery操作table,合并单元格,合并相同的行 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列}) /** * ...
- 使用POI创建word表格合并单元格兼容wps
poi创建word表格合并单元格代码如下: /** * @Description: 跨列合并 */ public void mergeCellsHorizontal(XWPFTable table, ...
- js 表格合并单元格
5列 根据需要可添加 或 删除 strOneTemp strTwoTemp strThreeTemp strFourTemp strFiveTemp //合并单元格 this.mergeC ...
- react antd Table动态合并单元格
示例数据 原始数组 const data = [ { key: '0', name: 'John Brown', age:22, address: 'New York No. 1 Lake Park' ...
- react ,ant Design UI中table组件合并单元格并展开详情的问题
需求:购物车订单列表,如图: 一:单元格合并 遇到这种你会怎么办呢? 单元格合并? 还是其他的方法? 下面是我的处理方式,就是在table 组件的columns上处理,这里拿商品举例,其余的类似, ...
- elementUI表格合并单元格
相信你肯定看了 ElementUI 官方文档了,没看的话先去看下表格各个属性的意义,方便下文阅读:传送门 但你会发现此例过于简单,死数据,但我们开发的时候往往都是后台传递过来的数据,导致我们 rows ...
- 设置table表格的单元格间距两种方式
table表格里设置单元格td之间的间距,通常用cellspacing设置单元格间距,有时候该属性可能无效,或需要用其他方式时,可用其他方式实现,例如在背景是白色背景的时候,设置单元格td的borde ...
- JS获取table表格任意单元格值
jsp页面表格布局 <body onload="show()"> <center> <input type="text" valu ...
- css table之合并单元格
colspan 是合并列,rowspan是合并行,合并行的时候,比如rowspan="2",它的下一行tr会少一列:合并列的时候 colspan="2",此行的 ...
随机推荐
- a标签href跳转---传值---禁止单引号
禁止加单引号1 href传参的值 (&t_type='航班') 错误 <a href="check_apply?applyid=<?=$applyid?>&am ...
- 分布式事务、XA、两阶段提交、一阶段提交
本文原文连接:http://blog.csdn.net/bluishglc/article/details/7612811 ,转载请注明出处! 1.XA XA是由X/Open组织提出的分布式事务的规范 ...
- NOIP2010-普及组复赛模拟试题-第一题-手机
题目背景 Background 现在手机使用越来越广泛了 题目描述 Description 一般的手机的键盘是这样的: 要按出英文字母就必须要按数字键多下.例如要按出 x 就得按 9 两下,第一 ...
- 36.中国特色社会主义的体制中有这样的现象:地方省政府要坚持党的领导和按 照国务院的指示进行安全生产。请编写一个java应用程序描述上述的体制现象。 要求如下: (1)该应用程序中有一个“党中央”接口:CentralPartyCommittee,该接口中 有个“坚持党的领导”方法:void partyLeader() (2)该应用程序中有一个“国务院”抽象类:StateCouncil,该抽象类中有
//接口:CentralPartyCommittee package jieKou; public interface CentralPartyCommittee { void partyLeader ...
- Thrift源码解析--transport
这一层主要是用于实现网络通信,现在都是基于Tcp/Ip,而Tcp/Ip协议栈由socket来实现,换句话说就是现在网络通信服务底层大都是通过socket实现的,在thrift源码中,就是将socket ...
- 在VS中生成后拷贝文件
环境:win7_64旗舰版,VS2013 工作项目中,一般会使用第三方库,当修改并重新编译第三方库后,需要将DLL文件拷贝到工作项目下的生成目录中,每次手动拷贝比较繁琐,VS提供自定义生成事件,允许我 ...
- unity Mesh(网格)的使用
创建两个三角形合成的矩形网格: GameObject obj= new GameObject(); MeshRenderer meshRenderer=obj.AddComponent<Mesh ...
- [原]innerText与innerHTML区别
window.onload = function () { document.getElementById('btn1').onclick = function () { ...
- iOS不可变数组的所有操作
#pragma mark 创建数组 //1.通过对象方法创建数组 NSArray * array = [[NSArray alloc]initWithObjects:@"One", ...
- cp 覆盖 \cp a test\a
使用cp命令覆盖文件总是提示要输入yes或no,一个两个就算了,大量的文件复制就不行了,即使加上-f参数也无法强行覆盖.苦思冥想不得解,终于在查阅了众多资料后让我找到了解决方法,这里写出来,让有同样困 ...