文档章节

datagrid中 formatter 的formatter样式不生效解决方案

GeminiLiu
 GeminiLiu
发布于 2016/06/21 11:10
字数 303
阅读 111
收藏 0

datagrid中formatter是在页面渲染后才执行,因此直接在formatter里使用datagrid自己的linkbutton样式无法生效

解决方案

在onLoadSuccess方法里使用js修改datagrid控件,另附图标自动闪动方法

<%layout("/eova/layout/default.html",{'title' : '系统监控'}){%>
<script>
var shinflag = false;//闪动标识
function shining(){
	if(shinflag){
		$(".conn-error").linkbutton({plain:true, iconCls:'icon-bulletcross'});
		shinflag = false;
	}else{
		$(".conn-error").linkbutton({plain:true, iconCls:'icon-readmetxt' });
		shinflag = true;
	}
}

function freshTable(){
	var url = $('#conn').datagrid('options').url;  
	if (url.indexOf("_t=") > 0) {  
	    url = url.replace(/_t=\d+/, "_t=" + new Date().getTime());  
	} else {  
	    url = url.indexOf("?") > 0  
	        ? url + "&_t=" + new Date().getTime()  
	        : url + "?_t=" + new Date().getTime();  
	}
	$('#conn').datagrid('reload');
}

$(function(){
	$('#conn').datagrid({
	    url:'/system/connLoad',
	    singleSelect: true,	
	    columns:[[
			{field:'connstatus',title:'状态',width:30,
				formatter: function(value, row, index){
			    if (value == "success") {
			        return "<a href='javascript:void(0);' class='conn-success' visibility='hidden'/>";
			    }else if(value == "error"){
			    	return "<a href='javascript:void(0);' class='conn-error'/>";
			    }else{
			    	return "<a href='javascript:void(0);' class='conn-ready'/>";
			    }
			}},
			{field:'name',title:'系统名称',width:70},
			{field:'url',title:'监听地址',width:220},
			{field:'destribute',title:'系统描述',width:110}
	    ]],
	    toolbar: [{
	        text: '手动刷新',
	        iconCls: 'icon-arrowrefresh',
	        handler: function () { freshTable(); }
	    }],
	    onLoadSuccess:function(data){ 
	    	$(".conn-success").linkbutton({plain:true, iconCls:'icon-accept' });
	    	$(".conn-error").linkbutton({plain:true, iconCls:'icon-bulletcross' });
	    	$(".conn-ready").linkbutton({plain:true, iconCls:'icon-hourglass' });
	    }
	});
	setInterval("freshTable();",60*1000);//设置60秒自动刷新
	setInterval("shining();",200);
})	
</script>
<table id="conn" width="auto" height="auto" class="easyui-datagrid" ></table>
<%}%>

 

© 著作权归作者所有

共有 人打赏支持
GeminiLiu
粉丝 3
博文 42
码字总数 12877
作品 0
西城
程序员
私信 提问
easyui1.4.2 formatter处理json内嵌数据undefined

问题描述: easyui升级到1.4.2后,原来使用的获取json嵌套数据的函数“formatter: function (value,row) { return row.business.region }”不好使了,datagrid初始化加载数据的时候,会报错提...

zqz0125
2015/07/03
0
2
easyui datagrid 日间格化(JS 日期时间本地化显示)

easyui datagrid 日期时间显示不正常,后台java 类型为 DATE 经过JSON工具一转化传到前台来就是这样,不便 于是想格式化一下, 格式化代码 如下: $('#gridTable').datagrid({ title: '系统通...

易水寒丶开源
2015/11/04
0
0
easyui的datagrid的某个field的取值是一个数组,如何利用formatter循环设置field和显示

页面显示效果: html页面设置datagrid的field字段: userList是从struts2传到前台的一个集合,该集合是用户的集合,每个用户有一个消耗,field根据userList来设置多个消耗字段 在JS中formatt...

文文1
2016/12/12
564
0
Easy ui 的 datagrid columns的formatter渲染问题

使用Easyui 的datagrid的组件,发现在$(function(){ //初始化datagrid}); 后,对formatter会执行一次渲染,结果是formatter:function(value,rowData,index){}是取不到数据的。等到$(funtion...

云海逍遥生
2015/08/31
1K
1
为datagrid的列加上formatter后为什么表格就无法显示出来了?

我有些datagrid的列需要加formatter,但某些列加上formatter就会导至datagrid整个无法显示,我测试把formatter函数直接返回固定值也不行,这到底是为什么啊?我确定列里的值都是非空的,有些...

耿军
2012/10/14
959
1

没有更多内容

加载失败,请刷新页面

加载更多

前端杂谈: 如何实现一个 Promise?

前端杂谈: 如何实现一个 Promise? 首先, 什么是 Promise? A promise is an object that may produce a single value some time in the future: either a resolved value, or a reason that i......

ssthouse_hust
8分钟前
1
0
Unsaft类

Unsafe类提供了硬件级别的原子操作,主要提供了以下功能 1、通过Unsafe类可以分配内存,可以释放内存; allocateMemory 分配内存 reallocateMemory 扩充内存 freeMemory 释放内存 2、可以定位...

器石_
8分钟前
1
0
git常用命令

首先打开git bash方式可以直接鼠标右击 或者在开始菜单(windows系统,苹果暂时不要问我,等我有钱买苹果电脑告诉你们0.0) 打开界面如下 1.查看远程仓库地址 git remote -v 2.创建本地分支 ...

熊小熊会写代码哦
19分钟前
2
0
离屏Canvas — 使用Web Worker提高你的Canvas运行速度

现在因为有了离屏Canvas,你可以不用在你的主线程中绘制图像了! Canvas 是一个非常受欢迎的表现方式,同时也是WebGL的入口。它能绘制图形,图片,展示动画,甚至是处理视频内容。它经常被用...

嫣然丫丫丫
21分钟前
2
0
SpringBoot 整合 BeetlSQL

SpringBoot 整合 BeetlSQL 1. beetlsql介绍 BeetSql是一个全功能DAO工具, 同时具有Hibernate 优点 & Mybatis优点功能,适用于承认以SQL为中心,同时又需求工具能自动能生成大量常用的SQL的应...

Jeff_Regan
22分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部