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

要在各个行上设置背景颜色，例如，如果是网格，则根据来到列的内容，您可以使用rowattr回调。它提供了最有效的解决方案（如果您使用gridview: true），因为它允许您在创建行时动态修改行的行的属性。因此，您只需告知jqGrid您希望在行中添加哪些其他属性。

The answer展示了这种方法。

问题的第二部分（关于复选框）对我来说并不清楚。标准formatter: "chechboxs"将用于在网格中显示数据和进行编辑。如果您删除formatter: "chechboxs"，但可以在dataInit 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};回调中实现所需的所有其他行为，则可以实施您的要求。您拥有的另一种可能性是使用editoptions。

更新：我建议您另外使用custom editing control。您有多个列使用复选框和多个列（'fini'，'ffin'），您可以使用datepicker。因此，如果您在代码中的某个位置定义了jqGrid变量的定义，那么您的代码将更小，更易读并且更易于管理：jqGrid变量包含列的公共属性：

colModel

然后您将能够将{ 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 }内jqGrid的相应列的定义重写为以下内容：

{{1}}

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

1 个答案: