Question

我的网格加载后，我将一个点击处理程序绑定到一个包含复选框的列。

$("#mygrid td input").each(function () {
 $(this).click(function () {
 });
});

在这个点击处理程序中是否有一个灵巧的方式来获取记录的pk / id与复选框所在的行对应的内容，所以我可以用它来调用服务器？

Answer 1

您可以使用eventObject事件的jQuery.click参数：

$("#mygrid td input").each(function () {
    $(this).click(function (e) {
        // e.target point to <input> DOM element
        var tr = $(e.target).closest('tr');
        alert ("Current rowid=" + tr[0].id);
    });
});

您应该只找到jQuery.closest所点击的<tr>元素所属的<input>（表格行）元素。 id元素的<tr>是填充网格时使用的rowid。

Answer 2

$("#treegrid").jqGrid({
        url: '${createLink(controller:"poa", action:"obtEstrucAreasDep")}',
        datatype: 'json',
        postData: {
            gestion: function() { return ${gestion}; }
        },
        mtype: 'GET',
        colNames: ["ID", "Nombre de Area", "Sigla", "Nivel", "Gener.HR", "Recep.HR", "Activo"],
        colModel: [
            {name:'id',    index:'id',    width:1,  hidden:true,  key:true},
            {name:'area',  index:'area',  width:95, hidden:false, sortable:true},
            {name:'sigla', index:'sigla', width:25, hidden:false, sortable:false, align:'center'},
            {name:'nivel', index:'nivel', width:1,  hidden:true,  align:'center'},
            {name:'genhr', index:'genhr', width:25, align:'center', editable: true, edittype:'checkbox', editoptions:{value:"True:False"}, formatter:"checkbox", formatoptions:{disabled:false}},
            {name:'recep', index:'recep', width:25, align:'center', editable: true, edittype:'checkbox', editoptions:{value:"True:False"}, formatter:"checkbox", formatoptions:{disabled:false}},
            {name:'activ', index:'activ', width:25, align:'center', editable: true, edittype:'checkbox', editoptions:{value:"True:False"}, formatter:"checkbox", formatoptions:{disabled:false}}
        ],
        treeGridModel: 'adjacency',
        height: 'auto',
        width: '500', //360
        treeGrid: true,
        ExpandColumn: 'area',
        ExpandColClick: true,
        caption: '${titulo}'+' - GESTION '+'${gestion}',
        onSelectRow: function(id){operRowJQGrid(id);}
    });

这是由JuanFer提供的

    jQuery(document).delegate('#treegrid .jqgrow td input', 'click', function(e){

        var tr = $(e.target).closest('tr');
        var rowid = tr[0].id;

        var $myGrid = jQuery('#treegrid');
        var i = $.jgrid.getCellIndex($(e.target).closest('td')[0]);
        var cm = $myGrid.jqGrid('getGridParam', 'colModel');
        var colName = cm[i].name;

        var y = $(this).val();
        var x = false

        if(y=='false'){
            $(this).val('true');
        }else{
            $(this).val('false');
        }
        x = $(this).val();
        alert("check = "+x+", id = "+rowid+", col name = "+colName);
    });

jqgrid：获取单击复选框的行的id

2 个答案: