ExtJS 4.1.0 ComboBox "setValue" Method

Posted By Vitaliy | June 26, 2012 | ExtJS 4.1.0
0 7061
In ExtJS 4.0.7 we can set combobox value by valueField, displayField or an object.
In ExtJS 4.1.0 - only by valueField or displayField.

Reply to thread

Js Code

Ext.widget('form', {
	title: 'Test Form',
	width: 400,
	bodyPadding: 10,
	tbar: [
		{
			text: 'Set value by id',
			handler: function () {
				this.up('form').down('#combo-1').setValue(1);
			}
		},
		{
			text: 'Set value by name',
			handler: function () {
				this.up('form').down('#combo-2').setValue('User-2');
			}
		},
		{
			text: 'Set value by object',
			handler: function () {
				this.up('form').down('#combo-3').setValue({ id: 3, name: 'User-3' });
			}
		}
	],
	items: [
		{
			itemId: 'combo-1',
			fieldLabel: 'By id',
			xtype: 'combouser'
		},
		{
			itemId: 'combo-2',
			fieldLabel: 'By name',
			xtype: 'combouser'
		},
		{
			itemId: 'combo-3',
			fieldLabel: 'By object',
			xtype: 'combouser'
		}
	],
	renderTo: Ext.getBody()
});
            

ExtJS 4.0.7 ComboBox "setValue" Method

Posted By Vitaliy | June 26, 2012 | ExtJS 4.0.7
0 4058
In ExtJS 4.0.7 we can set combobox value by valueField, displayField or an object.
In ExtJS 4.1.0 - only by valueField or displayField.

Reply to thread

Js Code

Ext.widget('form', {
	title: 'Test Form',
	width: 400,
	bodyPadding: 10,
	tbar: [
		{
			text: 'Set value by id',
			handler: function () {
				this.up('form').down('#combo-1').setValue(1);
			}
		},
		{
			text: 'Set value by name',
			handler: function () {
				this.up('form').down('#combo-2').setValue('User-2');
			}
		},
		{
			text: 'Set value by object',
			handler: function () {
				this.up('form').down('#combo-3').setValue({ id: 3, name: 'User-3' });
			}
		}
	],
	items: [
		{
			itemId: 'combo-1',
			fieldLabel: 'By id',
			xtype: 'combouser'
		},
		{
			itemId: 'combo-2',
			fieldLabel: 'By name',
			xtype: 'combouser'
		},
		{
			itemId: 'combo-3',
			fieldLabel: 'By object',
			xtype: 'combouser'
		}
	],
	renderTo: Ext.getBody()
});
            

MVC Application: Add Custom Events

Posted By Vitaliy | June 26, 2012 | ExtJS 4.1.0
0 3546
Reply to thread

Js Code

Ext.define('App.controller.Main', {
	extend: 'Ext.app.Controller',
	stores: ['Users'],
	init: function () {
		this.log('controller init');

		//add event
		this.application.addEvents('UsersStoreLoaded');

		this.getUsersStore().on('load', function (store) {
			this.log('store on load');
			//fire event
			this.application.fireEvent('UsersStoreLoaded', store);
		}, this); // controller scope

		//handle event
		this.application.on('UsersStoreLoaded', function (store) {
			this.log('app on UsersStoreLoaded');
		});
	},
	log: function (msg) {
		this.application.log(msg);
	}
});
            

Form.loadRecord By Field Name

Posted By Vitaliy | April 26, 2012 | ExtJS 4.1.0
0 3226
Reply to thead

Js Code

Ext.widget({
	xtype: 'form',
	title: 'Test Panel',
	width: 300,
	bodyPadding: 10,
	defaults: {
		xtype: 'textfield',
		anchor: '100%'
	},
	items: [
		{ name: 'name', fieldLabel: 'Name' },
		{ name: 'phone', fieldLabel: 'Phone' }
	],
	buttons: [
		{
			text: 'Load Record',
			handler: function () {
				var form = this.up('form');
				var user = Ext.create('User', {
					name: 'admin',
					phone: '911'
				});
				form.loadRecord(user);
			}
		}
	],
	renderTo: Ext.getBody()
});