In JQGrid add onclick event on img

I'm very new to JQuery, and I'm having some trouble

function Clients(guid)
{
 var that = this;

this.guid = guid;
this.container = $("#Clients_" + that.guid);

this.LoadClients = function () {
 var ids = that.container.find("#clients-tbl").getDataIDs();

    for (var i = 0; i < ids.length; i++) {
        var row = that.container.find("#clients-tbl").getRowData(ids[i]);

        var imgView = "<img src='../../Content/Images/vcard.png' style='cursor:pointer;' alt='Open case' onclick=OnClickImage(" + ids[i] + "); />";

        that.container.find("#clients-tbl").setRowData(ids[i], { CasesButtons:  imgView });
    }
}


this.CreateClientsGrid = function () {
    var clientsGrid = that.container.find("#widget-clients-tbl").jqGrid({
.....
 ondblClickRow:function(rowid)
{
   ---
}
  loadComplete: function () {
            that.LoadClients();


        }
 }
 this.OnClickImage=function(idClient){
  ....
 }

 this.Init = function () {
    that.CreateClientsGrid();
};

this.Init();
}

The problem is with oncli开发者_开发技巧ck, because OnClickImage is not global function. How can I use OnClickImage function?

You can bind to the click event in different ways. For example you can follow the way from the answer. By the way, it works much more quickly as getRowData and setRowData. Moreover you should save the result of that.container.find("#clients-tbl") operation in a variable outside of the loop and use use the variable inside the loop. JavaScript is dynamic language and every operation even ids.length will be done every time.

One more way would to use onCellSelect event without click event binding. See the answer which describe the approach and gives the corresponding demo.