as the title says I need to hide the collapsible image from one grid (I have many in the same web), and I cannot simply change the css because then every grid in my web would do the same, I want just that grid to have no background image.
I have tried to create a css class with background-image: none
and change the bodyCssClass, baseCls, cls configs, but I don't obtain the expected behaviour.
Any idea?
EDIT 1:
GridPanel code:
var grid = new Ext.grid.GridPanel({
id: "gridPanel1",
disableSelection: true,
frame: true,
title: "Centers",
//autoHeight: true,
height: 415,
width: 500,
store: store,
colModel: new Ext.grid.ColumnModel(items),
ctCls: 'noCollapsable',
view: groupingVi,
sm: selectionMod
});
css:
.noCollapsable{
background-image: none !important;
}
EDIT 2:
Yes! It's exactly like that example ( http://dev.sencha.com/deploy/ext-4.1.0-gpl/examples/grid/groupgrid.html ), but the background image it's in the
<div class="x-grid-group-title">Cuisine: CountryX (Y Items)</div>
and I don't have idea of how to use the Ext DomHelper or anything to change those divs' css inside this structure:
<tr id="gridview-1013-hd-CountryX" class="x-grid-group-hd x-grid-group-hd-collapsed">
<td class="x-grid-cell" colspan="2" style="padding-left:0px;">
<div class="x-grid-cell-inner">
<div class="x-grid-group-title">Cuisine: Country X (Y Items)</div>
</div>
</td>
</tr>
In which I could use first tr's id to distingish from the other grids, but as I said, I don't know how to access those divs