Extjs Add label on both sides of Checkbox

Question

Within a formpanel I have several fields and checkboxes. my form currently looks like this:

    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 ... /
        ]
    });

which produces

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

I was wondering if i can alter the second checkbox so it looks like this:

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

The (Attention ...) part should just be another label but on the other side. So can I add two labels to the same checkbox (each on a different side without to much exotic code)? I can't seem to find anything about it on the Sencha Forums

Answer 1

May be use boxLabel (and fieldLabel):

An optional text label that will appear next to the checkbox. Whether it appears before or after the checkbox is determined by the boxLabelAlign config.

Or afterBoxLabelTextTpl:

An optional string or XTemplate configuration to insert in the field markup after the box label text. If an XTemplate is used, the component's subTpl data serves as the context.

Example: https://fiddle.sencha.com/#fiddle/e59

Answer 2

I am sure this is not the most elegant solution but it's the first thing that comes to my mind:

  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