Jqgrid条件格式
jqgrid conditional formatting.
我试图在插入行后使用jqgrid添加条件格式。然而,似乎什么都没有发生。我在过去使用过afterInsertRow,它是有效的。有什么建议吗?
jQuery("#gridDevicePlan").jqGrid
({
url:'/dashboard/summarydeviceplans',
datatype: "json",
colNames:['Temporal','Short Name','Customer', 'Start', 'End', 'Duration', 'Device Count'],
colModel:[ {name:'Temporal',index:'Temporal'},
{name:'ShortName',index:'ShortName'},
{name:'Customer',index:'Customer'},
{name:'DateStart',index:'DateStart',formatter:'date', formatoptions:{srcformat:'Y-m-d H:i:s', newformat:'m/d/Y H:i'}},
{name:'DateStop',index:'DateStop',formatter:'date', formatoptions:{srcformat:'Y-m-d H:i:s', newformat:'m/d/Y H:i'}},
{name:'Duration',index:'Duration'},
{name:'DeviceCount',index:'DeviceCount'}
],
//multiselect: true,
rowNum:10,
rowList:[10,50,100,300],
//autowidth: true,
autowidth: true,
height: 'auto',
pager: '#pagerDevicePlan',
sortname: 'ShortName,Customer,DateStart',
mtype: "POST",
editurl:'/deviceplan/abort',
postData:{'deviceIDs[]':$('#device').val(),
'timezone':<?="'".$this->criteria['timezone']."'"?>,
'gmtStartDate':<?="'".$this->criteria['gmtStartDate']."'"?>,
'gmtStopDate':<?="'".$this->criteria['gmtStopDate']."'"?>
},
viewrecords: true,
sortorder: "asc",
grouping: true,
caption:false,
afterInsertRow: function(rowid, aData) { //set condiditonal formatting
alert(aData.Temporal);
if(aData.Temporal != 'Current'){
$("#"+rowid).addClass("ui-state-error");
}
}
});
jQuery("#gridDevicePlan").jqGrid('navGrid','#pagerDevicePlan',{edit:false,add:false,del:false});
我建议您不要使用afterInsertRow
。相反,您应该始终使用gridview: true
参数,这样可以提高jqGrid的性能而没有任何缺点。如果您使用gridview: true
,则网格主体的填充将首先构造为表示相应HTML片段的字符串,然后将主体作为一个操作放置在页面上。gridview: true
和afterInsertRow
不能同时使用。如果您使用afterInsertRow
,则网格的行将按顺序放置在页面上,然后在每次添加行后称为afterInsertRow
。页面中任何元素的放置都要求web浏览器需要重新计算页面中所有元素的位置。这使得网格的填充速度非常慢。
你应该做的是枚举loadComplete
中的网格行,并为网格的一些行添加"ui-state-error"类。顺便说一下,调用$("#"+rowid).addClass("ui-state-error");
在循环中也是无效的。<table>
DOM元素(loadComplete
内部的jQuery("#gridDevicePlan")[0]
或this
)具有rows属性,这对于行枚举非常有效。如果你必须找到表/网格行逐行,你可以使用行的另一个DOM方法namedItem
。它可以更有效地找到网格中的行。
你可以在这里找到你主要问题的答案。即使网格有相对较多的行,相应的演示也可以非常快地工作。
相关文章:
- Google Sheets自定义函数条件格式
- D3.js轴刻度条件格式
- Google Apps 脚本,用于根据一个单元格的值对另一个单元格进行条件颜色格式设置
- 带rhandontable的数字和条件格式
- 如何在不强制的情况下添加条件文本?[101,pdf格式]
- 在ng repeat中按条件设置格式/样式
- 当数据超过 5k 时,为动手提供条件格式的最佳方法
- HTML 表的条件格式因列而异
- 获取条件json格式的表单数据
- moment.js中有条件格式吗
- json格式的jison启动条件
- Jquery UI对话框条件格式
- 条件格式数据表DT R
- Jquery if条件,如果字符串格式不正确,将调用Alert
- 只上传具有特定格式的文件的条件
- Jqgrid条件格式
- 使用google脚本操作数据条件格式和数据验证
- HandsonTable条件格式
- Javascript中的HTML表条件格式代码没有按计划工作
- jQuery连接格式(字符串和条件语句)