PDA

View Full Version : ext js 4.1 :how to add an icon at the end of each column header in the grid panel



chandran09
20 Feb 2013, 12:34 AM
I want to show a help icon in the grid column header. On hovering the icon it should display a tooltip describing what exactly that column.Someone please help me to find a solution

scottmartin
20 Feb 2013, 5:40 AM
You can use a render on your column:



td.cell-icon {
background: url(../../resources/icons/filter-row-icon.png) no-repeat left !important;
padding: 0 5px 0 16px !important;
}




function renderIcon(val, meta, rec, rowIndex, colIndex, store) {
meta.tdCls = 'cell-icon';
meta.tdAttr = 'data-qtip="Icon Tip"';
return val;
};


You can also use an actionColumn if you want to have a click event:
http://cdn.sencha.com/ext-4.1.1a-gpl/examples/grid/array-grid.html

Scott.