CODEWITHSUNDEEP
extjsextjs6.2
CycleGeek
CycleGeek

Reputation: 501

EXTJS 6.2.1 Bulleted Group Similar to a CheckboxGroup

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

Upvotes: 0

Views: 34

Answers (1)

shae
shae

Reputation: 517

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';
}

Upvotes: 0

Related Questions