EXTJS 6.2.1 Bulleted Group Similar to a CheckboxGroup

45 Views Asked by At

Anyone know if there is an EXTJS control that can produce a bulleted group of items similar to what a checkbox group does?

1

There are 1 best solutions below

0
On BEST ANSWER

If you want a bulleted list appearance, you can customize the checkboxgroup styling using CSS like the example below

Ext.application({
    name: 'BulletListExample',
    launch: function () {
        Ext.create('Ext.form.Panel', {
            title: 'Bullet List Example',
            width: 300,
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'checkboxgroup',
                columns: 1,
                cls: 'bullet-list', // Apply custom CSS class
                items: [{
                        boxLabel: 'Item 1',
                        name: 'item1'
                    }, {
                        boxLabel: 'Item 2',
                        name: 'item2'
                    }, {
                        boxLabel: 'Item 3',
                        name: 'item3'
                    },
                    // Add more items as needed
                ]
            }]
        });
    }
});

CSS:

.x-form-checkbox-default:before {
    content: '\2022';
}

.x-form-cb-checked .x-form-checkbox-default:before {
    content: '\2022';
}