Can jqGrid hover text be defined with AddRowData?
Asked Answered
D

1

6

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!

Doi answered 13/9, 2011 at 16:27 Comment(0)
F
17

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:

enter image description here

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)

Fetter answered 13/9, 2011 at 20:54 Comment(5)
> If you have an interest for performance you should not use old addRowData method. Is there something that supersedes addRowData?Doi
Also, the cellattr's rawObject is Undefined. Are custom modification required in order for that to work?Doi
@Mark Maslar: Please, read my answer carefully. 1) I wrote that "the usage of data parameter in combination with gridview: true parameter" (see the first demo) gives you better performance as the usage of addRowData 2) To have no undefined results in tooltips in case of usage addRowData you have to use the bug fix. It used in the second demo.Fetter
@Fetter - have you used JqGrid with QTip before? What I like to do is on hover of and ID field which is a hyperlink, I like to call QTip and do a JSON.Fizzy
@WebDev: I don't used QTip before, but it seems that you should just call qtip on the <a> element. To answer on your question you should post more details how you create hyperlinks in jqGrid and which tooltip you want to display. In any way you should post the definition of the column from colModel which contains the hyperlink.Fetter

© 2022 - 2024 — McMap. All rights reserved.