datagrid中formatter是在页面渲染后才执行,因此直接在formatter里使用datagrid自己的linkbutton样式无法生效 解决方案 在onLoadSuccess方法里使用js
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><%}%>