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
    4,913
    Answers
    371
    Vote Rating
    179
    slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold

      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