Question

In jqGrid, is it possible to define a cell’s Title (hover) text while adding row data?

var rowid;

for(var j=0;j<10;j++)
  {
      rowid = jQuery.Guid.New();
      jQuery("#myJqGrid").jqGrid('addRowData',rowid,{Amount:"$"+j+".00",Date:"09/30/2015"});
  }

I’d prefer not to not to have to loop over the grid after it has completed, as the RowID and the data that is needed for the custom hover text are more readily available while the row is being added.

Thanks!

Answer 1

If you just need to set custom tooltip on some specific cells in the grid you can use setCell (see here an example). If you want to set tooltips on all cells of some column, but with a custom rule (not just the same tooltip like the cell value), you can better use cellattr. For example you can use

{name: 'name', index: 'name', width: 70,
    cellattr: function (rowId, val, rawObject, cm, rdata) {
        return 'title="' + rawObject.name + ' (' + rawObject.note + ')"';
    }}

See the demo here which display the following tooltips:

If you have an interest for performance you should not use old addRowData method which has many disadvantages:

• If you has date in input data and use formatter: ‘date’ then you have to use formatoptions: {reformatAfterEdit: true} to make the date correct formatted. You will find almost no information about the option in the documentation.
• The data which you inserted row after the row will be all placed on the same page. To have correct local date paging you have to reload the grid one more time.
• Compare with the usage of data parameter in combination with gridview: true parameter (the de demo above) the building of grid contain with respect of addRowData is much slowly. You can see the difference if the number of row is large.
• During creating of the demo which use cellattr and addRowData I found a bug in the jqGrid in the line where two parameters rowid and data are swapped. I just now posted the bug report. So to use cellattr together with addRowData you have to make small modification in jquery.jqGrid.src.js.

See the demo which use addRowData here. If used modified version of jquery.jqGrid.src.js (see my bug report for details)