行中的颜色和编辑值，但不显示Jqgrid

Question

我想知道是否可以为每一行(或某些行)使用不同的背景色。。

我还有一个问题，我定义了复选框，我只想在添加时设置，但我不想在网格显示所有行时看到它。。这可能吗？

这是我的密码。。

$("#<%=Me.Id & "_" %>lstBaseHab").jqGrid({
url: '/modulos/tarifa/basehabitacion.ashx',
datatype: 'xml',
mtype: 'GET',
colNames: ['Hab ID','Habitación','Importe', 'Fecha Inicio','Fecha Fin','Noches Estancia/Mínimas','Todos','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado','Domingo','tarId', 'estId'],
colModel: [
{ name: 'hab_id', index: 'hab_id', width: 100, align: 'center', editable: false, sortable: false, hidden: true},
{name: 'hab_nombre', index: 'hab_nombre', width: 200, align: 'center', edittype: 'select', editable: true, sortable: false, editrules: { edithidden: false, required: true }
, editoptions: { size: 1, dataUrl: '/modulos/tarifa/basehabitacion.ashx?oper=listahabs' }
},
{ name: 'tpb_importe', index: 'tpb_importe', width: 160, align: 'center', editable: true, sortable: true },
{ name: 'fini', index: 'fini', width: 300, align: 'center', editable: true, editoptions: { dataInit: function(el) { setTimeout(function() { $(el).datepicker({ dateFormat: 'dd/mm/yy' }); }, 200); } }, editrules: { edithidden: false }, sortable: true },
{ name: 'ffin', index: 'ffin', width: 300, align: 'center', editable: true, editoptions: { dataInit: function(el) { setTimeout(function() { $(el).datepicker({ dateFormat: 'dd/mm/yy' }); }, 200); } }, editrules: { edithidden: false }, sortable: true },
{ name: 'Nochesestancia', index: 'Nochesestancia', width: 300, align: 'center', sortable: false, editable: true },
{ name: 'Lun', index: 'lun', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "1:" }, editrules: { edithidden: false }, sortable: false },
{ name: 'Mar', index: 'mar', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "2:" }, editrules: { edithidden: false }, sortable: false },
{ name: 'Mie', index: 'mie', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "3:" }, editrules: { edithidden: false }, sortable: false },
{ name: 'Jue', index: 'jue', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "4:" }, editrules: { edithidden: false }, sortable: false },
{ name: 'Vie', index: 'vie', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "5:" }, editrules: { edithidden: false }, sortable: false },
{ name: 'Sab', index: 'sab', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "6:" }, editrules: { edithidden: false }, sortable: false },
{ name: 'Dom', index: 'dom', width: 50,  formatter: "checkbox", align: 'center', editable: true, hidden: true, edittype: "checkbox", editoptions: { value: "0:" }, editrules: { edithidden: false }, sortable: false }
],
ajaxSelectOptions: {
data: {
estId: function () { return __estId; }
}
},
ajaxGridOptions: {cache: false},
autoencode: false,
toppager: false,
loadonce:false,
pager: '#preciobasepager',
rowNum: 40,
rowList: [20, 40, 80, 100, 200, 500, 1000],
sortname: 'fini',
sortorder: 'asc',
autowidth: false,
width: 850,
height: -1,
shrinkToFit: true,
viewrecords: true,
gridview: true,
prmNames: {oper:"listarbaseshabitacion", addoper:"crearbasehabita", deloper:"borrabasehabita"},
caption: 'Precios base para habitaciones'
, editurl: '/modulos/tarifa/basehabitacion.ashx'
, postData: {
tarId: function ftar(){return __tarId;},
estId: function fest(){return __estId;}
}, afterSaveCell : function(rowid,name,val,iRow,iCol) { }
, loadComplete: function() { }
, onCellSelect: function(rowid, index, contents, event) {
<%=Me.id %>_selectedRow=jQuery(this).getRowData(rowid);
}
});
jQuery("#<%=Me.Id & "_" %>lstBaseHab").jqGrid('navGrid',
'#preciobasepager',
{ alerttext: "Seleccione un registro.",
add: true, addtitle: "Crear precio base", //addfunc: newPrecioBase, 
del: true, deltitle: "Eliminar precio base", // delfunc: delPrecioBase,
edit: false, edittitle: "Editar precio base",
search: false, searchtitle: "Buscar",
refresh: true,
cloneToTop: true
},
{ width: 350, resize: false, closeAfterEdit: true, recreateForm: true, viewPagerButtons: true, afterComplete: null },
{ width: 350, resize: false, closeAfterAdd: true, recreateForm: true, viewPagerButtons: true, afterComplete: null },
{ width: 350, resize: false, msg: "¿Desea eliminar la relación?", afterComplete: null }
);

如果我把hidden:true(可以在colModel中看到)放在它的隐藏显示中，但我不能在添加时定义它。。

谢谢。

Answer 1

要设置单行的背景色，例如根据网格中come列的内容，可以使用rowattr回调。它提供了最有效的解决方案(如果您使用gridview: true)，因为它允许您在创建行时动态修改行的属性。因此，您只需通知jqGrid您希望在行中具有哪些附加属性。

答案展示了该方法。

您问题的第二部分(关于checkboxs)我不清楚。标准的formatter: "chechboxs"将用于在网格中显示数据和进行编辑。如果删除formatter: "chechboxs"，但在editoptions的dataInit回调中实现所需的所有其他行为，则可以实现您的需求。还有一种可能性是使用自定义编辑控件。

更新：我建议您另外使用列模板。您有多个使用复选框的列和多个使用日期选择器的列("fini"、"ffin")。因此，如果您在代码中的某个地方定义了jqGrid变量的定义之上的某个位置，则您的代码将更小、更可读、更易于管理，这些变量包含列的公共属性：

var dateTemplate = { width: 300, align: 'center', editable: true
editoptions: {
dataInit: function(el) {
setTimeout(function() {
$(el).datepicker({ dateFormat: 'dd/mm/yy' });
}, 200);
}
}, editrules: { edithidden: false }, sortable: true },
checkboxTemplate = {width: 50,  formatter: "checkbox", align: 'center',
editable: true, hidden: true, edittype: "checkbox",
editrules: { edithidden: false }, sortable: false};

然后，您将能够将colModel内部jqGrid的相应列的定义重写为以下内容：

{ name: 'fini', template: dateTemplate },
{ name: 'ffin', template: dateTemplate },
...
{ name: 'Lun', index: 'lun', editoptions: {value: "1:"}, template: checkboxTemplate },
{ name: 'Mar', index: 'mar', editoptions: {value: "2:"}, template: checkboxTemplate },
{ name: 'Mie', index: 'mie', editoptions: {value: "3:"}, template: checkboxTemplate },
{ name: 'Jue', index: 'jue', editoptions: {value: "4:"}, template: checkboxTemplate },
{ name: 'Vie', index: 'vie', editoptions: {value: "5:"}, template: checkboxTemplate },
{ name: 'Sab', index: 'sab', editoptions: {value: "6:"}, template: checkboxTemplate },
{ name: 'Dom', index: 'dom', editoptions: {value: "0:"}, template: checkboxTemplate }