单击自定义按钮获取行数据

Question

I am using free jqgrid 4.14 and I need to have a custom image (some kind of mail icon) in my grid and when the image is clicked it should open a modal window having a form and which has the data of clicked row in the message field of form and also has other couple of field like sender mail id, receiver mail id and also a subject.

So, I was able to have a custom image in my grid. Now, we have onSelectRow property by which we can get the id of the clicked row and we have getRowData which will give the data of the columns.

So, I made changed onSelectRow a bit like this

onSelectRow: function(id){ 
            if(id && id!==lastSel){ 
                jQuery(this).restoreRow(lastSel); 
                lastSel=id; 
                var rowId = $(this).getRowData(lastSel);
            } 
            jQuery(this).editRow(id, true); 
        }

Now, this will give the data of each row when it is clicked. But how will I get same functionality when my custom image is clicked?

EDIT: I need something like this-

http://www.ok-soft-gmbh.com/jqGrid/Admin3.htm

But here I am not able to find the image like here it finding

Answer 1

There are many ways to implement the requirement. One from the easiest one I described in the answer . You can add the column with formatter: "actions"

{
    name: "act", template: "actions", width: 25,
    formatoptions: { editbutton: false, delbutton: false }
}

and the jqGrid option, which specify additional custom buttons

actionsNavOptions: {
    mailicon: "fa-envelope-o",
    custom: [
        {
            action: "mail",
            position: "first",
            onClick: function (options) {
                alert("Mail for rowid=" + options.rowid);
            }
        }
    ]
}

See https://jsfiddle.net/OlegKi/3tuxg71z/