在extjs 4中加载期间取消选中整个无线电组无线电场

时间:2014-01-24 11:31:22

标签: javascript jquery html5 extjs extjs4

这里,无线电组中的无线电场通常基于先前的选择进行选择。即,当刷新页面时,它自动设置先前的值。但我需要清除无线电组中的所有值。

this.mcmAdminServiceIndicatorsRadioGroup = new Ext.form.RadioGroup({
            width: 350,
            height: 50,
            items: [
                {
                    xtype: 'radiofield',
                    name: 'serviceIndicator',
                    fieldLabel: '',
                    inputValue: 'ADM',
                    boxLabel: 'ADM'
                },
                {
                    xtype: 'radiofield',
                    name: 'serviceIndicator',
                    margin: '0 0 0 20',
                    fieldLabel: '',
                    inputValue: 'BCK',
                    boxLabel: 'BCK'
                },
                {
                    xtype: 'radiofield',
                    name: 'serviceIndicator',
                    margin: '0 0 0 20',
                    fieldLabel: '',
                    inputValue: 'CKC',
                    boxLabel: 'CKC'
                },
                {
                    xtype: 'radiofield',
                    name: 'serviceIndicator',
                    margin: '0 0 0 20',
                    fieldLabel: '',
                    inputValue: 'BRK',
                    boxLabel: 'BRK'
                },
                {
                    xtype: 'radiofield',
                    name: 'serviceIndicator',
                    margin: '0 0 0 20',
                    fieldLabel: '',
                    inputValue: 'FMF',
                    boxLabel: 'FMF'
                }               
            ]
        });

我在另一个无线电组组件的列表器中尝试了这三种方式..

this.mcmTaskCategoryRadiogroup = new Ext.form.RadioGroup({
            width: 205, 
            height: 50,
            items: [
                { 
                    xtype: 'radiofield', 
                    name: 'type', 
                    inputValue: 'Customer',
                    boxLabel: 'Customer', 
                    checked: true 
                },
                { 
                    xtype: 'radiofield', 
                    name: 'type', 
                    inputValue: 'Admin',
                    boxLabel: 'Admin' 
                }
            ],
            listeners: {
                scope: this, 
                change: function(radiogroup, newValue, oldValue) { //will be trigger twice, one with both fields, and second with the new field

                    if(typeof(newValue.type) == 'string') {
                        if(newValue.type === 'Admin') {
                            this.mcmPassengerFieldSet.hide();
                            this.mcmPassengerServiceIndicatorsFieldSet.hide();
                            this.mcmAdminServiceIndicatorsFieldSet.show();
                            this.mcmRequestTypeCombobox.store.loadData([{ name: 'Admin' }], false);
                            this.mcmRequestTypeCombobox.setValue('Admin');
                            //this.mcmAdminServiceIndicatorsRadioGroup.setValue(false);


//this.mcmAdminServiceIndicatorsRadioGroup.setValue({ serviceIndicator: taskType });


this.mcmAdminServiceIndicatorsRadioGroup.items.items[0].setValue(true);
                        } else if(newValue.type === 'Customer') {
                            this.mcmPassengerFieldSet.show();
                            this.mcmPassengerServiceIndicatorsFieldSet.show();
                            this.mcmAdminServiceIndicatorsFieldSet.hide();
                            this.mcmRequestTypeCombobox.store.loadData([
                                { name: '5Star' }, 
                                { name: '5Key' },
                                { name: 'Concierge Key' }, 
                                { name: 'Focus Market' }, 
                                { name: 'Sales' }, 
                                { name: 'OA VIP' },
                                // TCS:09-24-2013 modified
                                { name: 'JL VIP' },
                                { name: 'BA VIP' },
                                { name: 'IB VIP' },
                                { name: 'QF VIP' },
                                // modification ended
                                { name: 'Other'  } 
                            ], false);
                            this.mcmRequestTypeCombobox.setValue(
                                this.mcmDisplayedRecord.get('RequestType') ? this.mcmDisplayedRecord.get('RequestType') : 'Other');
                        }
                    }
                }
            }
        });

2 个答案:

答案 0 :(得分:0)

您是否尝试从客户无线电领域中删除'checked:true'?

大卫

答案 1 :(得分:0)

我认为这是Ext JS的一个错误。下面的代码是一个重置函数源代码,存在于" Ext.form.field.Field"类。

reset : function(){
    var me = this;
    me.beforeReset();
    me.setValue(me.originalValue);
    me.clearInvalid();
    // delete here so we reset back to the original state
    delete me.wasValid;

}

说明:

上述函数将字段值设置为字段的实际原始值。这适用于除#34; radio"之外的所有其他类型。 "检查:false"设置也无法正常工作,即使收音机的基类是"复选框"(适用于复选框)。

<强>问题

我认为在选择无线电/无线电组的任何一个选项后会出现问题。无线电组件需要正确保持原始值,但每当我们检查/取消选中时,无线电组件的原始值都会改变。这就是重置功能无法重置无线电的原因。

<强>哈克

我为这个问题做了一个黑客攻击。我正在维护另一个键来保存我的原始收音机值,每当我调用复位功能时我都会手动设置该值。我已经覆盖了上面这个函数。

reset : function(){
    var me = this;
    me.beforeReset();
    me.setValue(me.initialDefaultValue);
    me.clearInvalid();
    // delete here so we reset back to the original state
    delete me.wasValid;

}

现在我可以创建一个这样的单选按钮,

{xype: 'radio', name: 'Test', initialDefaultValue: false, boxLabel: 'Hello'}

即使您通过调用form.reset()重置整个表单值,上述解决方案也能正常工作。

希望这有帮助..!