Question

在formpanel中，我有几个字段和复选框。我的表单目前看起来像这样：

    this.questionary= new Ext.form.FormPanel({
        labelWidth: 100,
           /... some further properties .../
        border: false,
        items: [
            {
                xtype: 'checkbox',
                id: 'chkHasCar',
                name: 'checkboxHasCar',
                fieldLabel: 'Has Car'
            },
            {
                xtype: 'checkbox',
                name: 'checkboxisEmployed',
                id: 'chkisEmployed',
                fieldLabel: 'Is employed'
            },
          /... Some more items ... /
        ]
    });

产生

Has Car      <<checkbox>>
Is employed  <<checkbox>>

我想知道我是否可以改变第二个复选框，所以它看起来像这样：

Has Car      <<checkbox>>
Is employed  <<checkbox>> (Attention ... )

(Attention ...)部分应该是另一个标签，但另一方面。那么我可以在同一个复选框中添加两个标签（每个标签位于不同的一侧而不需要太多异国情调的代码）？我似乎无法在Sencha论坛上找到任何关于它的内容

Answer 1

我确信这不是最优雅的解决方案，但这是我想到的第一件事：

  Ext.create('Ext.form.Panel', {
        title: 'Field with Label',
        width: 400,
        bodyPadding: 10,
        renderTo: Ext.getBody(),
        defaults: {
            xtype: 'container',
            layout: {
                type: 'hbox'
            }
        },
        items: [{
            items: [{
                xtype: 'textfield',
                fieldLabel: 'First Name'
            }, {
                xtype: 'label',
                forId: 'myFieldId',
                text: 'Additional text',
                margin: '0 0 0 10'
            }]
        }, {
            items: [{
                xtype: 'textfield',
                fieldLabel: 'Last Name'
            }, {
                xtype: 'label',
                forId: 'myFieldId',
                text: 'Additional text',
                margin: '0 0 0 10'
            }]
        }]
    });

https://fiddle.sencha.com/#fiddle/e57

enter image description here

Answer 2

可以使用boxLabel（和fieldLabel）：

复选框旁边会显示一个可选的文字标签。是否它出现在复选框确定之前或之后 boxLabelAlign config。

或afterBoxLabelTextTpl：

要在字段中插入的可选字符串或XTemplate配置框标签文本后的标记。如果使用XTemplate，则组件的subTpl数据用作上下文。

示例：https://fiddle.sencha.com/#fiddle/e59

Extjs在Checkbox的两侧添加标签

2 个答案: