Shanqi Jiang

Blog

toResizeTable and loading

页面引用这4种:

<link href="${pageContext.request.contextPath}/resource/js/jquery/plugin/loading/css/loading.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/resource/js/jquery/plugin/colresizable/css/main.css" rel="stylesheet">
<script src="${pageContext.request.contextPath}/resource/js/jquery/plugin/loading/CommonPerson.js"></script>
<script src="${pageContext.request.contextPath}/resource/js/jquery/plugin/colresizable/colResizable-1.6.min.js"></script>

js中添加这个方法:

//可拖拽
function toResizeTable() {
	$("#normal").colResizable({disable:true});
	$("#normal").colResizable({liveDrag:true,draggingClass:"dragging",resizeMode:'fit',gripInnerHtml:"<div class='grip'></div>"});
		}

页面可刷新div:

<!-- 4 定义局部刷新区域的id -->
<input type="hidden" name="id_zone" value="countriesList1"  loading="true" successRun="toResizeTable">

loading为加载时候的样式
successRun 可拖拽的js方法名
table中加上class样式加上text-nowrap

CSS实现内容超过长度后以省略号显示

样式:

	<width: 160px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;>

说明:
white-space: nowrap 保证文本内容不会自动换行,如果多余的内容会在水平方向撑破单元格
overflow: hidden 隐藏超出单元格的部分
text-overflow: ellipsis 将被隐藏的那部分用省略号代替