javascript-动态更新Extjs autoEl：’button’文本和CSS

2019-10-28 22:34:16 阅读：440 来源： 互联网

我是ExtJS的新手,想动态更改按钮的文本：
我的要求是预览按钮.为了提供预览,我创建了如下组件：

{
  xtype: 'container',
  width: '100%',
  padding: '20 0 20 0',
  itemId: 'preview-container',
  items: [
       {
          xtype: 'component',
          itemId: 'preview',
          autoEl    :'button'
       }
  ]
}

我的更新预览方法如下,我想从此函数更新按钮的文本：
我已经尝试过如下,但无法正常工作..

updatePreview: function () {
    var previewEl = this.down('#preview').getEl(),
        formValues = this.getForm().getValues(),
        newStyles = {};
    if (previewEl) {
        previewEl.text = formValues.name;
        previewEl.applyStyles(newStyles);
    }
}

更新：包括我所有的代码示例

    Ext.widget({
        xtype   : 'mz-form-widget',
        itemId: 'specialButtonRuleForm',
        defaults: {
            xtype: 'textfield',
            editable: false,
            listeners: {
                change: function (cmp) {
                    // alert(1);
                   cmp.up('#specialButtonRuleForm').updatePreview();
                }
            }
        },
        items: [
            {
                xtype: 'textfield',
                name: 'name',
                fieldLabel: 'Button label',
                allowBlank: false
            },
            {
                xtype: 'container',
                width: '100%',
                padding: '20 0 20 0',
                itemId: 'preview-container',
                    items: [
                        {
                            xtype: 'component',
                            itemId: 'preview',
                            autoEl    :'button'
                        }
                    ]
            }
        ],

        listeners: {
            afterrender: function (cmp) {
                // alert(2);
                cmp.updatePreview();
            }
        },

        updatePreview: function () {
            // alert(3);
            var previewEl = this.down('[itemId=preview]'),
                formValues = this.getForm().getValues(),
                newStyles = {};

            if (previewEl) {
                previewEl.setText(formValues.name);
                previewEl.applyStyles(newStyles);
            }
        }

    });

解决方法:

因为使用的是组件,所以没有通常的按钮方法.

您将需要做PreviewEl.getEl().dom.value =’New Text’;

标签：extjs,json,javascript,extjs4-1
来源： https://codeday.me/bug/20191028/1955750.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript-动态更新Extjs autoEl：’button’文本和CSS