jqGrid - 仅编辑可编辑列的某些行

时间:2010-05-19 08:21:21

标签: javascript jquery jqgrid

对于标记为可编辑的列中的某些单元格,是否可以在jqGrid中禁用编辑?

从我所看到的,唯一的选择是“所有单元格都可编辑”或“没有单元格可编辑”。 有办法解决这个问题吗?

2 个答案:

答案 0 :(得分:7)

我建议您使用这样命名的“内联编辑”进行行编辑。这种方法的最大优点是,它非常直观和用户。您可以在演示页面http://trirand.com/blog/jqgrid/jqgrid.html上查看它的工作原理。选择此演示“行编辑”,然后在左侧树部分选择“使用事件”或“输入类型”。使用此方法,您可以实现任何自定义验证,是否应允许在事件句柄onSelectRowondblClickRow内编辑所选行。如果允许编辑,则调用jqGrid的editRow方法。此方法为所有可编辑列创建输入控件,用户可以自然地修改行值。如果用户按“输入”键或在“esc”键上取消,则保存修改。

我个人更喜欢在editRow事件处理程序中实现调用ondblClickRow方法。因此,用户可以像往常一样继续选择行,并且可以使用双击进行行编辑。伪代码如下所示:

var lastSel = -1;
var isRowEditable = function (id) {
    // implement your criteria here 
    return true;
};
var grid = jQuery('#list').jqGrid({
    // ...
    ondblClickRow: function(id, ri, ci) {
        if (isRowEditable(id)) {
            // edit the row and save it on press "enter" key
            grid.jqGrid('editRow',id,true);
        }
    },
    onSelectRow: function(id) {
        if (id && id !== lastSel) {
            // cancel editing of the previous selected row if it was in editing state.
            // jqGrid hold intern savedRow array inside of jqGrid object,
            // so it is safe to call restoreRow method with any id parameter
            // if jqGrid not in editing state
            grid.jqGrid('restoreRow',lastSel);
            lastSel = id;
        }
    },
    pager: '#pager'
}).jqGrid('navGrid','#pager',{edit:false});

答案 1 :(得分:2)

你可以在逻辑上做到这一点。对于某些单元格可以编辑而某些单元格不可编辑的单元格,您必须具有一些标准。

我已逐行实施。

为jqgrid创建XML时,请为每行提供一些id。

根据这些ID,您可以使用jqgrid方法使这些行的单元格可编辑或不可编辑。

下面是beforeEditCell方法:

beforeEditCell: function(rowid, cellname, value, iRow, iCol) {
   // here identify row based on rowid
   // if the row should not be editable than simply make the cells noneditable using
   editCell(iRow, iCol, false);
   jQuery(gridid).jqGrid("restoreCell",iRow,iCol);

}

您可以自己进一步实施。

希望我的建议可以帮到你。 :)