View Full Version : qtips for grid columns

7 Jul 2009, 7:47 AM
I have a grid where the leftmost column contains an icon, depending on the type of thing in the row. How can I dynamically set a qtip for each icon in the grid?

9 Jul 2009, 6:16 AM

How about tooltip on mouseover a row, too?

9 Jul 2009, 6:27 AM
Let's assume you have a record with fields 'data' and 'tip', then you could use the following column config:

{header: 'My Column', dataIndex: 'data', renderer: function(v, meta, r){
meta.attr = 'ext:qtip="' + r.get('tip') +'"';
return v;

9 Jul 2009, 6:37 AM

I was hoping I wouldn't have to convert mouse X,Y to grid row & column to do this.

Nice and elegant solution.

Another question, though. What if I need to do the qtip contents via ajax?

9 Jul 2009, 7:56 AM
I guess Ajax is out using the template scheme.

There does appear to be an issue/bug with Ext 3.0.0.

var img = '<img src="'+Ext.util.format.htmlDecode(r.data.webPath)+'" width="'+r.data.width+'" height="'+r.data.height+'" />';
meta.attr = 'ext:qtip="' + Ext.util.Format.htmlEncode(img) + '" ext:qtitle="' + r.data.filename + '"';

For images wider than (guestimate) 200px, the image extends right of the right edge of the tooltip.

Possibly for height as well.