jqgrid image column is defined using colmodel below.
In form edit mode if mouse is over image cursor changes to hand but click in image is ignored.
How to show large image in separarate window if clicked in image ?
Large image is retued by url 'http://localhost/Grid/GetImage?id=' + options.rowId (without size parameter).
{"label":"Logo","name":"_image_Logo","edittype":"image",
"editoptions":{"src":""},
"editable":true,
"formatter":function(cell,options,row) {
return '<img src="http://localhost/Grid/GetImage?size=150&id=' +
options.rowId +'" />';
} ,
"search":false,"title":false,"width":150},
{"edittype":"file","label":"","name":"Logo","search":false,
"title":false,"width":150,"hidden":true,
"editrules":{"edithidden":true},"editable":true}
Update
I tried Oleg and Michael suggestions using colmodel below. I need to pass row id to image controller. In grid clicking image works OK, big image is opened. options.rowId returs image id.
In edit form, row id is not passed. How to pass options.rowId instead of e.target.id in click event ?
{"name":"Image",
"edittype":"image",
"editoptions":{
"src":"",
"dataEvents":[{"type":"click","fn":function(e) {
window.open('GetImage?id=' + e.target.id, e.target.id )
}
}]},
"editable":true,
"formatter":function(cell,options,row) {
return '<a href="GetImage?id=' + options.rowId+'"><img src="GetImage?size=54&id=' +
options.rowId +'" /></a>';
}
,"search":false,"title":false,"width":54},
You can use for example
onCellSelectorbeforeSelectRowto catchclickon the image and implement any custom action (like to show large image) which you need.If you need to implement some action on
clickon image only in the editing mode you can usedataEventsproperty of editoptions.