为什么Ext.getCmp(...)。setChecked导致错误

时间:2017-08-19 22:48:29

标签: extjs extjs6.2

我正在尝试在加载窗口时动态设置ExtJS 6.2 radiofield的已检查状态,以便编辑用户信息。

我的窗口代码如下

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'
        }]
    }]
}]

})

我的控制器代码是

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();
}

})

运行时

  

的console.log(Ext.getCmp( 'editUserReset2')。选中)

收到的结果符合预期“假”。

  

的console.log(Ext.getCmp( 'editUserReset2')。setChecked(真)   触发然后返回的错误是   未捕获的TypeError:Ext.getCmp(...)。setChecked不是函数   我已经尝试获得fieldcontainer然后是一个radiofield数组并使用setChecked(index,true)和相同的结果。

我已经检查了documentation,这是此xtype的一种方法。所以我已经陷入了这个错误产生的地方。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

感谢@EvanTrimboli提供以下答案......

我在Sencha的网站上使用了使用

的Modern Toolkit的文档
  

Ext.getCmp(...)。setChecked(真)

虽然我的代码实际上使用的是使用

的Classic Toolkit
  

Ext.getCmp(...)的setValue。(值)

作为设置单选按钮检查状态的方法。