如何在Extjs 4中使用自定义检查或选中的radiogroup事件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在Extjs 4中使用自定义检查或选中的radiogroup事件相关的知识,希望对你有一定的参考价值。

我只想在检查单选按钮时调用change事件,但是当我们设置值时,更改事件也会调用...就像这样。

Ext.getCmp('2007').setValue({ '2007': 'NoAccess' });

任何人都可以告诉我如何使用自定义检查事件或任何其他事件,以便我们仅在选中(单击)单选按钮上调用更改事件。

我正在使用Ext.Version 4.2.1。

这是我的代码: -

                 {
                    xtype: 'radiogroup',
                    fieldLabel: '  Admin Notes',
                    labelStyle: 'font-size: 12px;color:#3399CC;',
                    margin: '0 0 0 3',
                    defaultType: 'radio',
                    id: '2007', 
                    name: '2007',
                    defaults: {
                        flex: 1
                    },
                    items: [
                        {
                            boxLabel: 'Read and Update',
                            inputValue: 'ReadUpdate',
                            name: '2007'
                        }, {
                            boxLabel: 'Read Only',
                            margin: '0 0 0 20',
                            inputValue: 'ReadOnly',
                            name: '2007'
                        }, {
                            boxLabel: 'No Access',
                            inputValue: 'NoAccess',
                            name: '2007'
                        }
                    ],


                    listeners: {
                        change: function() {

                          alert("True");

                        },
答案

在首先使用setValue()之前,您需要使用以下两种RadioGroup方法。

1)。 suspendEventsuspendEventsSuspends the firing of particular or all events

2)。 radiogroup.setValue({name:'value'})将设置具有相应名称和值的无线电。

3)。 resumeEventresumeEvents恢复命名事件或所有事件的射击。

在这个FIDDLE中,我使用radiogroup创建了一个演示。我希望它能帮助您实现您的要求。

代码片段

Ext.create('Ext.form.Panel', {
    title: 'RadioGroup example with change event call when dyanmic value set.',
    bodyPadding: 10,
    renderTo: Ext.getBody(),
    items: [{
        xtype: 'radiogroup',
        fieldLabel: 'Admin Notes',
        defaultType: 'radio',
        id: '2007',
        defaults: {
            name: '2007'
        },
        items: [{
            boxLabel: 'Read and Update',
            inputValue: 'ReadUpdate'
        }, {
            boxLabel: 'Read Only',
            margin: '0 0 0 20',
            inputValue: 'ReadOnly'
        }, {
            boxLabel: 'No Access',
            inputValue: 'NoAccess'
        }],
        listeners: {
            change: function (cmp, newValue) {
                Ext.Msg.alert('Success', 'Checked value is :- ' + newValue['2007']);
            }
        }
    }],
    listeners: {
        afterrender: function () {
            var rb = Ext.getCmp('2007');
            rb.suspendEvents();
            rb.setValue({
                '2007': 'NoAccess'
            });
            rb.resumeEvents();
        }
    }
});

以上是关于如何在Extjs 4中使用自定义检查或选中的radiogroup事件的主要内容,如果未能解决你的问题,请参考以下文章

ExtJS 4 或 4.1 MessageBox 自定义按钮

在 ExtJs 4 网格中强制执行唯一键值

创建自定义布局 ExtJs 4.1

js+css--单选按钮,自定义选中的颜色???(性别按钮,男女)

Extjs 3.4 自定义 JSONReader

ExtJS 4(MVC)商店不使用我的自定义模型类