Window FAQ: Window With Header Tools

Posted By Vitalii | March 21, 2012 | ExtJS 4.0.7
0 2070
Config option "tools": an array of Ext.panel.Tool configs/instances to be added to the header tool area.

Js Code

Ext.widget('window', {
	title: 'Test Window',
	html: 'Click on button',
	width: 300,
	height: 200,
	bodyPadding: 10,
	tools: [
		{
			type: 'refresh',
			tooltip: 'Refresh',
			handler: function (event, target, owner, tool) {
				this.up('window').update('Refresh clicked');
			}
		},
		{
			type: 'help',
			tooltip: 'Help',
			handler: function (event, target, owner, tool) {
				this.up('window').update('Help clicked');
			}
		},
		{
			type: 'search',
			tooltip: 'Search',
			handler: function (event, target, owner, tool) {
				this.up('window').update('Search clicked');
			}
		}
	],
	autoShow: true
});
            

ExtJS 4.0.7 Closable FieldSet

Posted By Vitalii | March 16, 2012 | ExtJS 4.0.7
0 2449

Js Code

Ext.define('Ext.form.ClosableFieldSet', {
	extend: 'Ext.form.FieldSet',
	alias: 'widget.closablefieldset',
	initLegend: function () {
		var me = this;
		me.callParent(arguments);
		if (!me.legend.closable) {
			me.legend.insert(1, Ext.widget('tool', {
				type: 'close',
				handler: me.onCloseClick,
				scope: me
			}));
			me.legend.closable = true;
		}
	},
	onCloseClick: function () {
		if (this.ownerCt) {
			this.ownerCt.remove(this, true);
		}
	}
});