Results 1 to 2 of 2

Thread: Can not assign setValue(true) to a checkboxgroup

  1. #1

    Default Can not assign setValue(true) to a checkboxgroup

    Hi,
    I have the problem that when I am invoking the setValue() method of a checkboxgroup object and pass 'true' to it, it won't check the boxes but it unchecks them. And on the other hand if I do the same but pass the value 'false' to the setValue() method it unchecks all the boxes so it does what it pretend to. All this happens over a button bar with two buttons. One is called 'uncheck all' and the other one 'check all'. If I do loop through the checkboxgroup items below with the .each() method it works but not like postet below. You can run this code on fiddle.sencha.com. I have chosen Classic 7.0.0 and also 6.0.1.250.

    Code:
    Ext.application({
        name: 'Fiddle',
    
    
        launch: function () {
            Ext.create('Ext.panel.Panel', {
                renderTo: Ext.getBody(),
                width: 400,
                height: 300,
                title: 'Container Panel',
                bbar: [{
                        text: 'Unselect all',
                        handler: function () {
                            var cb1 = Ext.ComponentQuery.query('#hs1')[0];
                            var cb2 = Ext.ComponentQuery.query('#hs2')[0];
    
    
                            cb1.setValue(false);
                            cb2.setValue(false);
    
    
                        }
    
    
                    }, {
                        text: 'Select all',
                        handler: function () {
                            var cb1 = Ext.ComponentQuery.query('#hs1')[0];
                            var cb2 = Ext.ComponentQuery.query('#hs2')[0];
    
    
                            cb1.setValue(true);
                            cb2.setValue(true);
    
    
                        }
    
    
                    }
                ],
                items: [{
                    xtype: 'checkboxgroup',
                    label: 'Checkbox Group',
                    itemId: 'hs1',
                    // Arrange checkboxes distributed vertically.
                    // Automatically latter items flow to next column if
                    // available height is less to display all the items in single column.
                    vertical: true,
                    height: 100,
                    items: [{
                        label: 'Item 1',
                        name: 'cb-item-1',
                        value: '1'
                    }, {
                        label: 'Item 2',
                        name: 'cb-item-2',
                        value: '2',
                        checked: true
                    }, {
                        label: 'Item 3',
                        name: 'cb-item-3',
                        value: '3'
                    }, {
                        label: 'Item 4',
                        name: 'cb-common',
                        value: '4'
                    }, {
                        label: 'Item 5',
                        name: 'cb-common',
                        value: '5'
                    }, {
                        label: 'Item 6',
                        name: 'cb-common',
                        value: '6'
                    }]
                }, {
                    xtype: 'checkboxgroup',
                    label: 'Checkbox Group',
    
    
                    vertical: true,
                    height: 100,
                    itemId: 'hs2',
    
    
                    items: [{
                        label: 'Item 1',
                        name: 'cb-item-1',
                        value: '1'
                    }, {
                        label: 'Item 2',
                        name: 'cb-item-2',
                        value: '2',
                        checked: true
                    }, {
                        label: 'Item 3',
                        name: 'cb-item-3',
                        value: '3'
                    }, {
                        label: 'Item 4',
                        name: 'cb-common',
                        value: '4'
                    }, {
                        label: 'Item 5',
                        name: 'cb-common',
                        value: '5'
                    }, {
                        label: 'Item 6',
                        name: 'cb-common',
                        value: '6'
                    }]
                }]
            });
        }
    });

  2. #2
    Sencha User
    Join Date
    Oct 2018
    Location
    Noida
    Posts
    56
    Answers
    10

    Default

    Hi,

    That's the expected behavior of checkbox group's setValue(). If you check the documentation here -
    https://docs.sencha.com/extjs/7.0.0/...ethod-setValue

    Its written that If a checkbox's name is not in the mapping at all, it will be unchecked.
    So if you want to select the checkboxes through cbGroup.setValue() then you need to pass an object with all names of checkboxes you have inside that group with true value like -
    cbGroup.setValue({
    'cb-item-1': true,
    'cb-item-2': true,
    .
    .
    .
    });

    OR optionally you can loop through the cbgroup items(which are checkboxes) and manually call setValue(true) for each checkbox.
    OR (not a preferred way), you can override the setValue() of checkboxgroup in your project and make the behavior you want

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •