1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    6
    Answers
    1
    Vote Rating
    0
    courtera is on a distinguished road

      0  

    Default Answered: Can not set CheckboxModel

    Answered: Can not set CheckboxModel


    I am trying to create a checkcolumn where I can only select 1 checkbox at a time. I have tried multiple ways of setting the CheckboxModel but have not gotten any of them to work. I am running 4.1.1. Below is my current attempt using checkcolumn. Any help is greatly appreciated thanks!

    Code:
    Ext.define('SelectorPanel' , {
       alias: 'widget.selectorpanel'
       extend: 'Ext.grid.GridPanel'
       height: 100,
       autoScroll: true,
    
       initComponent:function() {
          var me = this;
    
         var options = [ thing1, false, 'Thing1' ];
    
          var optionsStore = Ext.create('Ext.data.ArrayStore', {
              fields:['id', 'selectionbox' , 'text'],
              data:options
           });  
      
        var sm1 = Ext.create('Ext.selection.CheckboxModel' , {
              mode: 'SINGLE'
         });
    
      Ext.applyIf(me, {
           store: optionsStore,
           columns: [
               { 
                  xtype: 'checkcolumn',
                  width: 25,
                  selModel: sm1,
                 dataIndex: 'selectionbox'
                },
               {
                 dataIndex: 'text',
                 text: 'Things'
               }
            ]
    
        this.callParent(arguments);
    });
    
       }
    
    });

  2. Thanks for the reply slemmon, I did notice that I was using a checkcolumn and could not apply the selectionmodel to that so I revised the code a bit and was able to get it to work.

    Code:
    Ext.define('SelectorPanel' , {
       alias: 'widget.selectorpanel'
       extend: 'Ext.grid.Panel'
       height: 100,
       autoScroll: true,
    
       initComponent:function() {
          var me = this;
    
         var options = [ thing1, false, 'Thing1' ];
    
          var optionsStore = Ext.create('Ext.data.ArrayStore', {
              fields:['id', 'selectionbox' , 'text'],
              data:options
           });  
      
        var sm1 = Ext.create('Ext.selection.CheckboxModel' , {
              mode: 'SINGLE',
              showHeaderCheckbox: false,
              listeners: { select: function(model, record, index) {alert(record.get('id'); }} 
         });
    
      Ext.applyIf(me, {
           store: optionsStore,
                  selModel: sm1,
           columns: [
               {
                 dataIndex: 'text',
                 text: 'Things'
               }
            ]
    
        this.callParent(arguments);
    });
    
       }
    
    });

  3. #2
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    5,369
    Answers
    433
    Vote Rating
    200
    slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of

      0  

    Default


    I didn't think you set a selectionmodel on a column. This work at all for you?

    Code:
    Ext.define('SelectorPanel' , {
        alias: 'widget.selectorpanel'
        , extend: 'Ext.grid.GridPanel'
        , height: 100
        , width: 100
        , store: Ext.create('Ext.data.ArrayStore', {
            fields:['id', 'selectionbox' , 'text'],
            data:[[ 1, false, 'Thing1' ], [ 2, false, 'Thing2' ]]
        })
        , columns: [{
            dataIndex: 'text'
            , text: 'Things'
            , flex: 1
        }]
        , selModel: {
            selType: 'checkboxmodel'
        }
    });
    
    
    Ext.widget('selectorpanel', {
        renderTo: Ext.getBody()
    });

  4. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    6
    Answers
    1
    Vote Rating
    0
    courtera is on a distinguished road

      0  

    Default


    Thanks for the reply slemmon, I did notice that I was using a checkcolumn and could not apply the selectionmodel to that so I revised the code a bit and was able to get it to work.

    Code:
    Ext.define('SelectorPanel' , {
       alias: 'widget.selectorpanel'
       extend: 'Ext.grid.Panel'
       height: 100,
       autoScroll: true,
    
       initComponent:function() {
          var me = this;
    
         var options = [ thing1, false, 'Thing1' ];
    
          var optionsStore = Ext.create('Ext.data.ArrayStore', {
              fields:['id', 'selectionbox' , 'text'],
              data:options
           });  
      
        var sm1 = Ext.create('Ext.selection.CheckboxModel' , {
              mode: 'SINGLE',
              showHeaderCheckbox: false,
              listeners: { select: function(model, record, index) {alert(record.get('id'); }} 
         });
    
      Ext.applyIf(me, {
           store: optionsStore,
                  selModel: sm1,
           columns: [
               {
                 dataIndex: 'text',
                 text: 'Things'
               }
            ]
    
        this.callParent(arguments);
    });
    
       }
    
    });

Thread Participants: 1

Tags for this Thread