javascript with css

hi experts
I am using Ext-js 4.2 and i am trying to hide the group title row for my grouping (in grid).
This is my css

.x-grid-group-hd-collapsible .x-grid-group-title {
/*background-image:none;*/
/*visibility: hidden;*/
display:none;
}

This works partially , the group title row is not displayed but i still see some space like attached image. I thought display:none; will remove the space but it doesnt seem to work. Any clues on how to remove the space?

thanks in advance.
blank-space.png

JavaScriptCSS

Last Comment

royjayd

8/22/2022 - Mon

SSupreme

3/24/2015

You need to look at parent layout element and see what properties creates space, as child element already not displayed.
Example or source required to say more.

royjayd

3/24/2015

ASKER

hi, thanks for response, this is my grid (with grouping) and store definitions

//Grid

items: [
			        {
				xtype: 'grid',
			    id : currGroupGrid,
			    alias: 'widget.currGroupGrid',			     
			    height :  175,
			    width :  180,
			    stripeRows : false,
				columnLines: true,					
				store: 'currency.CurrencyGroupingStore',
				margin : '3 3 3 3',
			    columns: [				 
				{header: 'Currency', dataIndex: 'currencyCode', flex: 1,sortable:true,hideable:false} //this column has blank spaces
				],
				 
				features: [
				{
				ftype: 'grouping',	  
				groupHeaderTpl: '{name} {[values.rows.length > 1 ? "("+values.rows.length+")" : ""]}',  
				hideGroupedHeader: false,
				startCollapsed: false
				  }
				 ],
			   
			    viewConfig: {
				stripeRows : false,
				getRowClass: function(record, index) {
					//set appropriate css
					debugger;
					if (record.data.type == 'ADD'){
						return 'newLineItem'; //'newLineItem';
					} 
					}			
				}				 
				}

Open in new window

//Store

Ext.define('CustomerRep.store.currency.CurrencyGroupingStore', {
	id : 'currencyGroupingStore',
    extend: 'Ext.data.Store',
    model: 'CustomerRep.model.currency.CurrencyGroupingModel',   //CurrencyGroupingModel contains currencyCode and currencyGroup
    alias: 'widget.currencyGroupingStore',  
	
	autoLoad : false,
	
	 
	groupers: ['currencyGroup'], //grouping done on currencyGroup 
	
    pageSize : 500,
	 
    proxy: {
        type: 'ajax',         
        url: 'getcurrencyGroupingData.controller',
		method:'GET',
		reader: {
            type : 'json',
			root : 'data',
			totalProperty : 'total',
			successProperty: 'success'
			
        }
    }
});