extjs4 - extjs using up and down methods -

i'm trying use up , down call rather ext.getcmp i'm not quite understanding it. have code

listeners: {     'change': function(field, selectedvalue) {         // ext.getcmp('wildanimal').setvalue(selectedvalue);         this.up('form').down('#wildanimal').setvalue(selectedvalue);     } } 

inside larger code

ext.define('ryan', {     constructor: function() {         ext.create('ext.form.panel', {             bodystyle: {"background-color":"green"},             name: 'mypanel',             title: 'animal sanctuary, 1 animal per location  ',             width: 300,             bodypadding: 10,             test: 'mycat',             style: 'background-color: #fdd;',             renderto: ext.getbody(),             items: [{                 itemid: 'button1',                 xtype: 'button',                 text: 'click button',                 handler: function() {                     alert('(<^_^>)');                 }             },{                 itemid: 'wildanimal',                 xtype: 'textfield',                 fieldlabel: 'animal:',                 name: 'myanimal'             },{                 itemid: 'mycombo',                 xtype: 'combo',                 fieldlabel: 'choose animal',                 store: animals,                 querymode: 'local',                 displayfield: 'name',                 listeners: {                     'change': function(field, selectedvalue) {                         // ext.getcmp('wildanimal').setvalue(selectedvalue);                         this.up('form').down('#wildanimal').setvalue(selectedvalue);                     }                 }             }]         });     } });  var animals = ext.create('ext.data.store', {     fields: ['itemid', 'name'],     data: [{         "itemid": 'mycat',         "name": "mycat"     },{         "itemid" : 'mydog',          "name": "mydog"     },{         'itemid' : 'sbbargirls',          "name": "bargirls-when-drunk"     }] });  ext.onready(function() {     var = ext.create('ryan');     var b = ext.create('ryan'); }); 

what i'm confused on why need hashtag in wildanimal working. when switch ext.form.panel widget.window listeners code stops working. code creates window can't pass value of combobox can when it's form panel. understand up used find stuff parent class. when using widget.window call this.up(widget)? can't work. i'm new ext js many things may go on head >__<.

the up , down methods used traverse component tree.

when using up , down selectors, default selector checks xtype of component. up('form') means "keep going component tree until find form." #wildanimal selector means "keep going until find component id == 'wildanimal'". if use up() no selectors, returns parent container.

if decide use ext.window.window instead of ext.form.panel need change occurrences of up('form') up('window'). otherwise, if know "mycombo" , "wildanimal" sibling components can use up().down('#wildanimal') , work after changing type of parent container.