1、增加行背景色
gridComplete: function () {
var rows = $("#datagridId").getDataIDs();
for (var i = 0; i < rows.length; i++) {
//列表某个字段判断条件
var progress = $("#datagridId").getCell(rows[i], "progress");
if ("01" == progress) {
$("#datagridId").jqGrid('setRowData', rows[i], false, {
background: '#FF8C8C',
});
//修改行字体颜色
("#" + rows[i] + " td").css("color", "black")
}
}
}
2、增加横向滚动条
1、jqGrid属性 shrinkToFit: false,
2、$("#datagridId").closest(".ui-jqgrid-bdiv").css({"overflow-x": "scroll",});
3、列表增加背景色和修改列表字体颜色
var dataGridColModel = [
{label: 'id', name: 'id', key: true, width: 75, hidden: true},
{label: '比例', name: 'percentage', cellattr: percentageCellattr, formatter: percentageFormatter},
]
//比例背景色
function percentageCellattr(cellValue, option, rowObj) {
if (Number(rowObj.percentage.replace("%", "")) < Number("50%".replace("%", ""))) {
return "style='background-color: red;'";
} else {
return "style='background-color: green;'";
}
}
//比例字体
function percentageFormatter(cellValue, option, rowObj) {
return "" + rowObj.percentage + ""
}
4、列表增加CSS样式
var dataGridColModel = [
{label: 'id', name: 'id', key: true, width: 75, hidden: true},
{label: '比例', name: 'percentage',classes:"lineWrap"}
]
5、jqGrid列表textarea文本框内容换行
/* 如果列表固定某个字段换行,则在列表字段单独加CSS样式,参考4 */