datagrid中 formatter 的formatter样式不生效解决方案
datagrid中 formatter 的formatter样式不生效解决方案
GeminiLiu 发表于2年前
datagrid中 formatter 的formatter样式不生效解决方案
  • 发表于 2年前
  • 阅读 63
  • 收藏 0
  • 点赞 0
  • 评论 0

移动开发云端新模式探索实践 >>>   

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

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>
<%}%>

 

标签: datagrid formatter
  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 3
博文 39
码字总数 11978
×
GeminiLiu
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: