UberGrid not calling constructor correct?

Questions related to our Sencha Touch based grid component
Post Reply
User avatar
tiberian
Posts: 1
Joined: Mon Apr 01, 2013 10:21 pm

UberGrid not calling constructor correct?

Post by tiberian »

Hi everybody,

I am trying out your really awesome UberGrid for a project. It seems to be the right thing for now, but one thing is unclear to me.
The project is a very strait forward MVC Application and the UberGrid needs to fit it's paradigm. So I tried to configure the Grid like this:

Code: Select all

Ext.define('MDE.view.Ubergrid', {
	extend : 'UberGrid.Panel',
	xtype  : 'mde.ubergrid',

	requires : [
		//'Ext.field.Number',
		'UberGrid.Panel',
		'MDE.store.GridRow',
		'MDE.store.GridHeader',
	],

	config : {
		headerStore: true,

		margin: 0,
		rowHeight: 50,
		columnLines: false
	},

	constructor: function( config ) {
		config.columns = [];

		//Eine Standardbreite der spalten setzen - ca. 6 spalten auf dem Screen
		config.defaultWidth = Math.floor(Ext.Viewport.getWindowWidth() / 6);

		//jetzt aus dem Store dynamisch den Header generieren
		config.headerStore = Ext.create('MDE.store.GridHeader');
		config.store = new MDE.store.GridRow();
		config.columns = this._createColumnsFromStore(config.headerStore, config.defaultWidth);
		config.rowHeight = 50;

		this.callParent([config]);
	},

	/**
	 * Erstellt initial die Colum Konfiguration
	 *
	 * @param store
	 * @param defaultWidth
	 * @return {Array}
	 * @private
	 */
	_createColumnsFromStore: function(store, defaultWidth) {
		..
	}
});
What is done in "_createColumnsFromStore" is basically creating the columns array from another store. Which works fine ..
The Problem is, that the default config properties (e.g. rowHeight) are not set. As you can see in the screenshot the height is still at 30px. What did I wrong on implementing the grid? The way I did it should work as far as I know.

Thanks for your help!

Michael

PS: The View "MDE.view.Ubergrid" is an "item" of an TabPanel which you may see on the screenshot
Attachments
Screenshot of the current rendering showing the default height of 30
Screenshot of the current rendering showing the default height of 30
Bildschirmfoto 2013-04-01 um 22.08.35.png (237.88 KiB) Viewed 5337 times

User avatar
mats
Core Developer
Core Developer
Posts: 15893
Joined: Sat Dec 19, 2009 11:41 pm
Location: Sweden
Contact:

Re: UberGrid not calling constructor correct?

Post by mats »

Works fine for me, please give us a simple test case to inspect. Modified 'basic' sample below.

Code: Select all

Ext.define('Meeting', {
    extend : 'Ext.data.Model',

    config : {
        fields : ['Id', 'Title', 'StartDate', 'Location']
    }
});

Ext.define('Foo', {
    extend : 'UberGrid.Panel',

    constructor: function( config ) {
        config.rowHeight = 200;

        this.callParent([config]);
    },
});


Ext.setup({
    onReady: function () {
        var grid = new Foo({
            margin              : 20,

            columns             : [
                {
                    header      : 'Id',
                    dataIndex   : 'Id',
                    width       : 60,
                    cellCls     : 'id'
                },
                {
                    header      : 'Name',
                    dataIndex   : 'Title',
                    flex        : 1
                },
                {
                    header      : 'Start Date',
                    dataIndex   : 'StartDate',
                    width       : 200
                },
                {
                    header      : 'Location',
                    dataIndex   : 'Location',
                    width       : 250
                }
            ],

            store : new Ext.data.Store({
                autoLoad    : true,
                model       : 'Meeting',
                proxy       : {
                    type    : 'ajax',
                    url     : 'data.js',
                    reader  : { type : 'json' }
                }
            })
        })
        
        Ext.Viewport.add(grid);
    }
});


Tired of debugging javascript errors in web applications? Try our new error logging service RootCause, or read more on the Sencha blog

@bryntum
Facebook
API documentation

Post Reply