1. #1
    Sencha Premium Member
    Join Date
    Oct 2012
    Location
    Zurich, Switzerland
    Posts
    21
    Vote Rating
    0
    jack83 is on a distinguished road

      0  

    Default CheckboxSelectionModel - how to use dataIndex for checkbox column?

    CheckboxSelectionModel - how to use dataIndex for checkbox column?


    I use CheckboxSelectionModel as a table column with checkboxes. The column should show which panels are actually visible in the main panel and the user can check or uncheck the visibility of the panels with these checkboxes.

    The method createStoreForSelection() provides a data store which contains the attributes 'widgetName' (String) and 'visible' (boolean). The data in this store are correct when I write them on the console, but all the checkboxes in the checkbox column are empty.

    Does anyone know how to make ext js read and show in the checkbox the data from the data store?
    I haven't found any examples showing how to set the checkboxes from data store in CheckboxSelectionModel


    Here is the code:

    Code:
        var cbxSelModel = new Ext.grid.CheckboxSelectionModel({
            checkOnly: false,
            singleSelect: false,
            sortable: false,
            dataIndex: 'visible',
            width: 20,
            listeners: {
                selectionchange : function(selModel) {
                },
                scope: this
            }
        });
    
        var selectionPanel = new Ext.grid.GridPanel({
            store: createStoreForSelection(),
            selModel: cbxSelModel,
            height: 380,
            columns: [
                { 
                    header: 'col1',
                    dataIndex: 'widgetName',
                    sortable: false,
                    width: 280,
                    fixed: true
                },
                cbxSelModel
            ]
        });

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi jack83,

    You can find the selected checkbox grid record on the "selectionchange" listeners of the CheckBoxSelectionModel class, like -

    Code:
    listeners: {
                selectionchange : function(selModel, selected, opts) {
                    var length = selected.length
                        , record =[];
                    for(var i = 0; i<length;i++){
                       record.push(selected[i].data.yourStoreFieldName);                    
                    }
                    alert(record);
                }
            }
    Read API docs - http://docs.sencha.com/ext-js/4-1/#!...electionchange
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha Premium Member
    Join Date
    Oct 2012
    Location
    Zurich, Switzerland
    Posts
    21
    Vote Rating
    0
    jack83 is on a distinguished road

      0  

    Default


    Thank you for your quick reply.

    I use Ext JS 3.4 and the method from Ext JS 4 does not apply here. I understand what you mean in the example but it does not apply to my problem I think.

    I become the data from the server. There is an information about widget name and its visibility. I simply want that the CheckboxSelectionModel column knows that the records in which the visibility value is set to 'true' have a marked check box.

    The event selectionChanged will be helpful for me to inform the server about the changes user made in the popup dialog. But first of all, I'd like to know how to solve the problem of letting the CheckboxSelectionMode know about the value from the store. Is it actually possible to do it without a manual store iteration and checking its every single record? In the source code of CheckboxSelectionModel there is a property dataIndex but it's not documented and there are no examples how to use is with this selection model

  4. #4
    Sencha User
    Join Date
    Jan 2011
    Posts
    546
    Vote Rating
    52
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    I guess what you would need to do is loop through the records and check the visibility value, then use the selectionModel's selectRecords() or selectRows() methods to make the required ones checked:
    http://docs.sencha.com/ext-js/3-4/#!/api/Ext.grid.CheckboxSelectionModel-method-selectRecords
    http://docs.sencha.com/ext-js/3-4/#!...hod-selectRows

  5. #5
    Sencha User
    Join Date
    Jan 2011
    Posts
    546
    Vote Rating
    52
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0