I'm trying to set the checked state of an ExtJS 6.2 radiofield dynamically when a window is loaded for editing user information.
My window code is as follows
Ext.define('scim.view.users.EditUserWdw', {
extend: 'Ext.window.Window',
alias: 'widget.EditUserWdw',
id: 'editUserWdw',
required: [
'scim.view.users.UserController',
'Ext.form.Panel'
],
width: 400,
listeners: {
beforeclose: function (wdw) {
var frm = this.down('form');
if (frm.isDirty()) {
Ext.Msg.show({
title: 'Confirm Cancel',
msg: '<p>You started editing a user. Closing this window now will cause you to lose any information you changed.</p><p>Are you sure?</p>',
icon: Ext.Msg.QUESTION,
buttons: Ext.Msg.YESNO,
fn: function (ans) {
if (ans == 'yes') {
frm.reset();
wdw.close();
}
}
});
return false;
} else {
return true;
}
}
},
items: [{
xtype: 'form',
reference: 'form',
id: 'editUserFrm',
border: false,
style: 'background-color: #fff',
url: '/scim_libs/Users.php?metho=updateUser&userId=' + sessionStorage.userId,
padding: 5,
bbar: ['->', {
xtype: 'button',
text: 'Update User',
iconCls: 'x-fa fa-save',
handler: function () {
var frm = this.up('form');
if (frm.isValid()) {
frm.submit({
success: function (frm, response) {
var jData = Ext.util.JSON.decode(response.resposnse.responseText);
if (jData.status == "duplicate") {
Ext.Msg.show({
title: 'Duplicate Email',
msg: '<p>The email address <strong>' + Ext.getCmp('editUserEmail').getValue() + '</strong> is already used by another user.</p><p>Please use a different email address and try adding the user again.</p>',
icon: Ext.Msg.ERROR,
buttons: Ext.Msg.OK,
closable: false,
fn: function () {
Ext.getCmp('editUserEmail').focus();
this.close();
}
})
}
else if (jData.status == "success") {
Ext.getStore('User').load();
Ext.Msg.show({
title: 'User Added',
msg: '<p>The user <strong>' + Ext.getCmp('editUserFirstName').getValue() + ' ' + Ext.getCmp('addUserLastName').getValue() + '</strong> has been updated successfully.</p>',
icon: Ext.Msg.INFO,
buttons: Ext.Msg.OK,
fn: function () {
Ext.getCmp('addUserFrm').reset();
Ext.getCmp('addUserWdw').close();
}
})
} else {
Ext.Msg.show({
title: 'Unexpected Error!',
msg: '<p>An unexpected error occurred when trying to update the user <strong>' + Ext.getCmp('addUserFirstName').getValue + ' ' + Ext.getCmp('adduUserLastName').getValue() + '</strong>. Please try updating the user again.</p><p>Should this problem persist, please contact technical support and provide the following information:</p><p>' + jData.status + '</p>',
icon: Ext.Msg.ERROR,
buttons: Ext.Msg.OK,
fn: function () {
Ext.getCmp('addUserFrm').reset();
Ext.getCmp('addUserWdw').close();
}
})
}
}
})
}
}
}, {
xtype: 'button',
text: 'Cancel',
iconCls: 'x-fa fa-ban',
handler: function () {
this.up('form').up('window').close();
}
}],
items: [{
xtype: 'textfield',
anchor: '100%',
name: 'editUserFirstName',
id: 'editUserFirstName',
fieldLabel: 'First Name',
allowBlank: false,
minLength: 2,
madLength: 65,
selectOnAutoFocus: true,
listeners: {
afterrender: function () {
this.focus(true);
}
}
}, {
xtype: 'textfield',
anchor: '100%',
name: 'editUserLastName',
id: 'editUserLastName',
fieldLabel: 'Last Name',
allowBlank: false,
minLength: 2,
maxLength: 65
}, {
xtype: 'textfield',
anchor: '100%',
name: 'editUserEmail',
id: 'editUserEmail',
fieldLabel: 'Email',
allowBlank: false,
maxLength: 255,
selectOnFocus: true,
vtype: 'email'
}, {
xtype: 'textfield',
anchor: '100%',
name: 'editUserPhone',
id: 'editUserPhone',
fieldLabel: 'Phone',
maskRe: /[0-9]/,
regexText: 'Numbers Only',
allowBlank: true,
vtype: 'phone',
maxLength: 14,
listeners: {
change: function () {
if (this.getValue().length == 3) {
this.setValue('(' + this.getValue() + ') ');
}
if (this.getValue().length == 9) {
this.setValue(this.getValue() + '-');
}
}
}
}, {
xtype: 'fieldcontainer',
fieldLabel: 'Reset Password',
itemId: 'editUserResetGrp',
defaults: {
flex: 1
},
layout: 'hbox',
width: 200,
items: [{
xtype: 'radiofield',
boxLabel: 'Yes',
name: 'editUserReset',
inputValue: 1,
id: 'editUserReset1'
}, {
xtype: 'radiofield',
boxLabel: 'No',
name: 'editUserReset',
inputValue: 0,
id: 'editUserReset2'
}]
}, {
xtype: 'fieldcontainer',
fieldLabel: 'Lock Account',
defaults: {
flex: 1
},
layout: 'hbox',
width: 200,
items: [{
xtype: 'radiofield',
boxLabel: 'Yes',
name: 'editUserLocked',
inputValue: 0,
id: 'editUserLocked1'
}, {
xtype: 'radiofield',
boxLabel: 'No',
name: 'editUserLocked',
inputValue: 1,
id: 'editUserLocked2'
}]
}]
}]
})
My controller code is
Ext.define('scim.view.users.UserController', {
extend: 'Ext.app.ViewController',
alias: 'controller.user',
addUser: function () {
var addUserWdw = Ext.create('scim.view.users.AddUserWdw', {
title: 'Add New User'
}).show();
},
editUser: function (grid, rowIndex, colIndex) {
var objRow = Ext.getStore('User').getAt(rowIndex);
var editUserWdw = Ext.create('scim.view.users.EditUserWdw', {
title: 'Edit User - ' + objRow.data.userFirstName + ' ' + objRow.data.userLastName
}).show();
Ext.getCmp('editUserFirstName').setValue(objRow.data.userFirstName);
Ext.getCmp('editUserLastName').setValue(objRow.data.userLastName);
Ext.getCmp('editUserEmail').setValue(true);
Ext.getCmp('editUserPhone').setValue('(' + objRow.data.userPhone.substr(0, 3) + ') ' + objRow.data.userPhone.substr(3, 3) + '-' + objRow.data.userPhone.substr(6, 4));
console.log(objRow.data.reset);
if (objRow.data.reset == 0) {
console.log(Ext.getCmp('editUserReset2'));
console.log(Ext.getCmp('editUserReset2').checked);
Ext.getCmp('editUserReset2').setChecked(true);
console.log(Ext.getCmp('editUserReset2').checked);
} else {
console.log(Ext.getCmp('editUserReset1'));
}
},
getUsers: function () {
Ext.getStore('Users').load();
}
})
When running
console.log(Ext.getCmp('editUserReset2').checked)
The results received are as expected "false".
console.log(Ext.getCmp('editUserReset2').setChecked(true) triggers then the error returned is Uncaught TypeError: Ext.getCmp(...).setChecked is not a function I've tried getting the fieldcontainer and then an array of radiofield's and using setChecked(index, true) with the same results.
I've checked the documentation and it is a method to this xtype. So I've become stumped in where this error is generating from. Any help would be greatly appreciated.
