В одной из моих панелей у меня есть панель форм
xtype: 'form',
id: 'formJobSummary',
layout: {
align: 'stretch',
type: 'hbox'
}
Я хочу привязать данные к этому и иметь следующий код.
var form = Ext.getCmp('formJobSummary').getForm();
form.loadRecord(user);
Я получаю: Ext.getCmp ("formJobSummary") не определено
Так что, очевидно, loadRecord находится вне области видимости.Учитывая, что моя архитектура от дизайнера и имеет 2 файла.Куда я положу этот оператор loadRecord.
MyPanel.js
//Define a model with field names mapping to the form field name
Ext.define('UserModel', {
extend: 'Ext.data.Model',
fields: ['quotedPrice', 'name']
});
//Create an instance of the model with the specific value
var user = Ext.create('UserModel', {
quotedPrice: 'test',
name: 'test'
});
Ext.define('MyApp.view.MyPanel', {
extend: 'MyApp.view.ui.MyPanel',
initComponent: function () {
var me = this;
me.callParent(arguments);
me.down('button[text=Submit]').on('click',
me.onSubmitBtnClick, me);
me.down('button[text=Cancel]').on('click',
me.onCancelBtnClick, me);
},
onSubmitBtnClick: function () {
var conn = new Ext.data.Connection();
var est = Ext.getCmp('estimate');
alert(est.getValue());
conn.request({
method: 'POST',
url: 'tmp.php',
params: {
foo: "bar"
},
success: function (responseObject) { alert(responseObject.responseText); },
failure: function () { alert(est); }
});
},
onCancelBtnClick: function () {
}
});
var form = Ext.getCmp('formJobSummary').getForm(); //returns form1
form.loadRecord(user);
ui / MyPanel.js
Ext.define('MyApp.view.ui.MyPanel', {
extend: 'Ext.panel.Panel',
height: 600,
width: 950,
layout: {
align: 'stretch',
type: 'vbox'
},
title: 'JobPanel',
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [
{
xtype: 'tabpanel',
activeTab: 0,
flex: 1,
items: [
{
xtype: 'panel',
layout: {
align: 'stretch',
type: 'hbox'
},
title: 'Job Summary',
items: [
{
xtype: 'form',
id: 'formJobSummary',
layout: {
align: 'stretch',
type: 'hbox'
},
bodyPadding: 10,
title: '',
url: '/submit.html',
flex: 1,
dockedItems: [
{
xtype: 'toolbar',
flex: 1,
dock: 'bottom',
items: [
{
xtype: 'button',
text: 'Submit'
},
{
xtype: 'button',
text: 'Cancel'
}
]
}
],
items: [
{
xtype: 'panel',
flex: 1,
items: [
{
xtype: 'radiogroup',
width: 400,
fieldLabel: 'Job Type',
items: [
{
xtype: 'radiofield',
boxLabel: 'Fix Price'
},
{
xtype: 'radiofield',
boxLabel: 'Production'
}
]
},
{
xtype: 'textfield',
id: 'quotedPrice',
name: 'quotedPrice',
fieldLabel: 'Quoted Price'
},
{
xtype: 'textfield',
id: 'clientPO',
name: 'clientPO',
fieldLabel: 'Client PO'
},
{
xtype: 'textfield',
id: 'jobQuantity',
name: 'jobQuantity',
fieldLabel: 'Job Quatity'
},
{
xtype: 'textfield',
id: 'filesOver',
name: 'filesOver',
fieldLabel: 'Files Over'
},
{
xtype: 'textfield',
id: 'previousJobId',
name: 'previousJobId',
fieldLabel: 'Previous JobId'
},
{
xtype: 'textfield',
id: 'estimate',
name: 'estimate',
fieldLabel: 'Estimate'
}
]
},
{
xtype: 'panel',
flex: 1
},
{
xtype: 'panel',
layout: {
align: 'stretch',
type: 'hbox'
},
flex: 1
}
]
}
]
},
{
xtype: 'panel',
title: 'Parts'
},
{
xtype: 'panel',
title: 'Process'
},
{
xtype: 'panel',
title: 'Invoice'
}
]
},
{
xtype: 'panel',
layout: {
align: 'stretch',
type: 'vbox'
},
title: 'FooterPanel',
flex: 1
}
]
});
me.callParent(arguments);
}
});