Ext.MessageBox.show generate 'propHandler.get is not a function' error

[loi.vo]

Hi,
I'm new to ExtJS. I did a simple Ext.MessageBox.show call. When the user click on a link, I popup this confirmation save changes dialog:

Ext.MessageBox.show( {
title: 'confirmation',
msg: 'Your changes have not been applied, do you want to continue',
buttons: Ext.MessageBox.OKCANCEL,
icon: Ext.MessageBox.QUESTION,
height: 200,
animCollapse: false,
fn: function(btn) {
if (btn == 'ok') {
processOk();
} else {
return false;
}
},

});


function processOk() { }

However, when the confirmation dialog popups, Firefox keeps showing the following errors:

propHandler.get is not a fucntion. (ext-all-debug.js line 35812)

Worse yet, after I click on 'ok' or 'cancel' button to close the dialog, this error message keeps being generated. It looks like there is a background task running to keep looping. What is wrong?

Thanks,

[arthurakay]

Copy/pasting your code, I don't see the error. What version of ExtJS are you running?

[loi.vo]

I maintain somebody else code that has add a method to the Object prototype. This causes the issue.

If you cut&paste the following example, and click on 'Send' button, you'll see the errors. This is from extjs/examples/form/field-types.js and add the Object.prototype.F_setLeafValue property.

Ext.require([
'Ext.form.*'
]);


if(!Object.prototype.F_setLeafValue)
{
Object.prototype.F_setLeafValue = function(leaf, value)
{
if(this[leaf] != null)
this[leaf] = value;
else
{
this[leaf] = new Object();
this[leaf] = value;
}
}
}


Ext.onReady(function() {


var formPanel = Ext.create('Ext.form.Panel', {
frame: true,
title: 'Form Fields',
width: 340,
bodyPadding: 5,


fieldDefaults: {
labelAlign: 'left',
labelWidth: 90,
anchor: '100%'
},


items: [{
xtype: 'textfield',
name: 'textfield1',
fieldLabel: 'Text field',
value: 'Text field value'
}, {
xtype: 'textfield',
name: 'password1',
inputType: 'password',
fieldLabel: 'Password field'
}, {
xtype: 'filefield',
name: 'file1',
fieldLabel: 'File upload'
}, {
xtype: 'textareafield',
name: 'textarea1',
fieldLabel: 'TextArea',
value: 'Textarea value'
}, {
xtype: 'displayfield',
name: 'displayfield1',
fieldLabel: 'Display field',
value: 'Display field <span style="color:green;">value</span>'
}, {
xtype: 'numberfield',
name: 'numberfield1',
fieldLabel: 'Number field',
value: 5,
minValue: 0,
maxValue: 50
}, {
xtype: 'checkboxfield',
name: 'checkbox1',
fieldLabel: 'Checkbox',
boxLabel: 'box label'
}, {
xtype: 'radiofield',
name: 'radio1',
value: 'radiovalue1',
fieldLabel: 'Radio buttons',
boxLabel: 'radio 1'
}, {
xtype: 'radiofield',
name: 'radio1',
value: 'radiovalue2',
fieldLabel: '',
labelSeparator: '',
hideEmptyLabel: false,
boxLabel: 'radio 2'
}, {
xtype: 'datefield',
name: 'date1',
fieldLabel: 'Date Field'
}, {
xtype: 'timefield',
name: 'time1',
fieldLabel: 'Time Field',
minValue: '1:30 AM',
maxValue: '9:15 PM'
}],
buttons: [{
text: 'Cancel',
handler: function() {
this.up('form').getForm().reset();
}
}, {
text: 'Send',
handler: function() {
Ext.MessageBox.alert('Information', 'Data sent!');
}
}]
});


formPanel.render('form-ct');


});