css - jqGrid中的行选择器列

Question

有没有办法像 jqGrid 中的图像一样实现行选择器。当我单击该行时，在最左侧的列上会出现一个类似图标的指针。

谢谢！

这是我添加的代码

onSelectRow: function(rowId) {
         if (rowId && rowId != lastsel) {
             $(this).jqGrid('restoreRow', lastsel);
             $(this).jqGrid('editRow', rowId, true);

             var ic = "";

             if (lastsel) {
                 $(this).setCell(lastsel, 0, ic, '');
             }

             ic = '<img src="images/ig_tblTri_Black.gif" />';
             $(this).setCell(rowId, 0, ic, '');

             lastsel = rowId;
         }
     }

代码正在执行，但图像未显示。

Answer 1

您可以使用为 定义的onSelectRow 或onCellSelect事件jqGrid编写一个函数，该函数在列数据中添加或删除图像

onSelectRow: function(rowId){ 
//code to add image and remove from all other rows
 var ids = $("#grid").jqGrid('getDataIDs');
var ic = "";
for(var i=0;i < ids.length;i++){
jQuery("#grid").jqGrid('setRowData',rowId,{colName:ic});
}
ic = "<img src='path/images/buttons/icon.gif'/>";
jQuery("#grid").jqGrid('setRowData',rowId,{colName:ic});
   },

onCellSelect: function(id, iCol, cellContent, e){ 
//code to add image and remove from all other rows 
 var ids = $("#grid").jqGrid('getDataIDs');
var ic = "";
for(var i=0;i < ids.length;i++){
jQuery("#grid").jqGrid('setRowData',rowId,{colName:ic});
}
ic = "<img src='path/images/buttons/icon.gif'/>";
jQuery("#grid").jqGrid('setRowData',id,{colName:ic});
}

更新 ：

正如@Oleg 建议的那样，可以在没有太多开销的情况下使用的另一个事件是：
beforeSelectRow：

beforeSelectRow: function(id, e){ 
//code to add image and remove from all other rows 
 var gsr = jQuery("#grid").jqGrid('getGridParam','selrow');
var ic = "";
jQuery("#grid").jqGrid('setRowData',gsr,{colName:ic});
ic = "<img src='path/images/buttons/icon.gif'/>";
jQuery("#grid").jqGrid('setRowData',id,{colName:ic});
}