PDA

View Full Version : Finding the itemId that created a window with a form and buttons.



jivex5k
26 May 2017, 10:00 AM
I'm having trouble retrieving the itemId of a form panel that created another window with a form in it. To clarify I have this form item:



Ext.define('Mayhem.view.insurance.card',
{ extend: 'Ext.form.Panel',
alias: 'widget.insurancecard',
width: 250,
bodyPadding: 5,
buttons: [{
xtype: 'button',
itemId: 'insuranceAddButton',
icon: 'resources/icons/add.png',
iconAlign: 'right',
text: 'Add Insurance'
}],
items: [{
xtype: "displayfield",
value: "Medicare",
name: "payor"
},
{
xtype: "displayfield",
value: "123456",
name: "payorSubscriptionId"
},
{
xtype: 'container',
layout: {
type: 'hbox',
align: 'stretch'
},
items: [{
xtype: "displayfield",
value: "John",
name: "firstName"
},
{
xtype: "displayfield",
value: "Doe",
name: "lastName",
margin: '3,0,0,0'
}]
}]
});

When I click the add button it is handled by this controller:


Ext.define('Mayhem.controller.Insurance.Card',
{ extend: 'Ext.app.Controller',
stores: ['Mayhem.store.Patients'],
models: ['Mayhem.model.Patient'],
views: [
'Mayhem.view.insurance.card',
'Mayhem.view.insurance.EditWindow'
],


init: function () {
this.control({
'insurancecard': {
render: function (panel) { //Have to do this because panels don't have click events
var me = this;
panel.body.on('dblclick', function () {
me.editInsurance(panel);
});
}
},
'button[itemId=insuranceAddButton]': {
click: function (button) {
this.editInsurance(button.up('insurancecard')); //make sure to pass the insurance card to the editInsurance function
}
}
});
},


editInsurance: function (insurancecard) {
console.log('Double clicked on ' + insurancecard.itemId);
var view = Ext.widget('insuranceedit');
}
});

This creates the following window object:


Ext.define('Mayhem.view.insurance.EditWindow',
{ extend: 'Ext.window.Window',
alias: 'widget.insuranceedit',
title: 'Edit Insurance Info',
requires: ['Mayhem.view.insurance.EditForm'],
autoShow: true,
resizable: false,
shadow: true,
modal: true,
initComponent: function () {
var payors = Ext.create('Mayhem.store.PayorTypes');
this.items = [
{
xtype: 'combobox',
emptyText: 'Choose Insurance',
displayField: 'payorType',
editable: false,
valueField: 'payorType',
store: payors,
itemId: 'payorTypeComboBox',
width: 500,
padding: 5
},
{
xtype: 'insuranceeditform',
itemId: 'insuranceEditForm',
hidden: true,
}
];


this.buttons = [
{
text: 'Update',
itemId: 'updateButton'
},
{
text: 'Cancel',
itemId: 'cancelButton',
scope: this,
handler: function () {
this.close();
}
}


];


this.callParent(arguments);
}
});




Now this window object button is handled with this controller:


Ext.define('Mayhem.controller.Insurance.EditWindow',
{ extend: 'Ext.app.Controller',
requires: ['Mayhem.view.insurance.EditWindow', 'Mayhem.view.insurance.card'],
init: function () {
this.control({
'combobox[itemId=payorTypeComboBox]': {
change: function (combo, records, eOpts) {
var payorTypeSelected = combo.rawValue;
console.log(payorTypeSelected);
var editWindow = combo.up();
var editForm = editWindow.down('[itemId=insuranceEditForm]')
editForm.show();
if (payorTypeSelected.toLowerCase() == 'medicare')
this.isMedicare(true);
else
this.isMedicare(false);
}
},
'button[itemId=updateButton]': { //When the update button is clicked we want to update the relevant stores
click: function (button) {
console.log("Mmmm");
//get form data here
}
},
});
}

The updatebutton listener cannot access the itemId of the original form item that created the window. Using up() get's me a toolbar, and then the window itself, but I cannot go up beyond that. Any help with this would be greatly appreciated!

jivex5k
30 May 2017, 4:48 AM
Well I figured it out, just assigned an itemID on window creation based on what instance of the card object created it.