PDA

View Full Version : Accessing component from one js to another js



vms.saran
9 Aug 2010, 11:30 PM
hi i am new to Extjs . can any one help me to solve my problem . i am having a file test.js

Tezt.js

var fp = new Ext.FormPanel({

buttons: [{
text: 'Clear',
handler: function(){

}
},{
text: 'Upload',
id : '_UploadButtonjs',
handler: function(){
fp.getForm().reset();
}
},{
text: 'Close',
handler: function(){
win.hide();
win.destroy();
win.close();
}
}]
});

I am having another file sample.js

Now i want to access the button click function of upload in Sample.js file...
How do i access the button from test.js to sample.js

Animal
9 Aug 2010, 11:35 PM
You can give it an ID and use Ext.getCmp

Or your single top-level, application object can keep references to important, application-wide objects (If that's what this FormPanel is)

Or the object which is encapsulating the current functionality you are implementing can keep a reference to that FormPanel.

If you are writing "function soup", then you're stuck with Ext.getCmp.

If you design your application as a family of cooperating classes, you will be better off, and able to keep track of everything.

vms.saran
9 Aug 2010, 11:38 PM
thx for ur reply animal

I have given the id for the button.. but even now i cant access

Animal
9 Aug 2010, 11:42 PM
Let me check my crystal ball....

Nope, I can't see what's happening.

vms.saran
9 Aug 2010, 11:45 PM
hi animal.... this is the pbm i am experiencing now.. i will provide u with full code....


test.js

Extensive.grid.ButtonClickTab = Ext.extend(Ext.grid.RowSelectionModel, {
width: 125,
sortable: false,
dataIndex: 0, // this is needed, otherwise there will be an error
menuDisabled: true,
fixed: true,
id: 'buttonClick',
header:'Upload',
// header:'File Upload',
initEvents: function()
{
Extensive.grid.ButtonClickTab.superclass.initEvents.call(this);
this.grid.on('cellclick', function(grid, rowIndex, columnIndex, e){
if(columnIndex==grid.getColumnModel().getIndexById('buttonClick')) {
var win;
var fp = new Ext.FormPanel({
//renderTo: 'fi-form',
fileUpload: true,
width: 500,
frame: true,
title: 'File Upload Form',
autoHeight: true,
bodyStyle: 'padding: 10px 10px 0 10px;',
labelWidth: 50,
defaults: {
anchor: '95%',
allowBlank: false,
msgTarget: 'side'
},
items: [{
allowBlank :false,
id :'file',
inputType :'file',
name :'myFile',
fieldLabel :'Upload',
anchor :'95%',
required :true,
autoShow :true,
width: 400,
labelWidth: 150,
xtype :'textfield'
}],
buttons: [{
text: 'Clear',
handler: function(){

}
},{
text: 'Upload',
id : '_UploadButtonjs',
handler: function(){
fp.getForm().reset();
}
},{
text: 'Close',
handler: function(){
win.hide();
win.destroy();
win.close();
}
}]
});
if(!win){
win = new Ext.Window({
layout:'fit',
modal:true,
width:500,
autoHeight : true,
autoScroll:true,
closeAction:'hide',
closable : false,
plain: true,
items: [ fp ]

});
}
win.show();
}
if(columnIndex==grid.getColumnModel().getIndexById('deleter')) {
var record = grid.getStore().getAt(rowIndex);
grid.getStore().remove(record);
grid.getView().refresh();
}
});
},
renderer: function(v, p, record, rowIndex){
return '<div class="extensive-button" style="width: 15px; height: 16px;"></div>';
}
});

how do i access the upload button in another file sample.js

evant
10 Aug 2010, 12:26 AM
Please stop posting help questions in the open discussion forum, use the help forum below.

Moving to help.

Animal
10 Aug 2010, 12:34 AM
Please post code in [code] tags to make it readable.