1. #1
    Sencha User
    Join Date
    Jul 2011
    Posts
    72
    Vote Rating
    4
    Answers
    2
    ragecf is on a distinguished road

      0  

    Default Answered: Enable Text Selection By a button

    Hi All,

    Happy new year!

    I wanted to enable/disable textselection by a button.

    Code:
    Ext.Create('Ext.grid.Panel', {
    ......... viewConfig: {
    enableTextSelection: false
    }, bbar: [
    text: '', iconCls: 'icon-enable-selection', toolTip: 'Enable Text Selection', enableToggle: true, handler: this.enableSelection,
    scope: this ]
    }; enableSelection: function(btn, state) {
    //how to set the enableTextSelection to true and make it effective?
    }
    Thanks.

  2. See if this helps. Worked for me in Firefox.

    Code:
    Ext.create('Ext.data.Store', {
        storeId:'simpsonsStore',
        fields:['name', 'email', 'phone'],
        data:{'items':[
            { 'name': 'Lisa',  "email":"lisa@simpsons.com",  "phone":"555-111-1224"  },
            { 'name': 'Bart',  "email":"bart@simpsons.com",  "phone":"555-222-1234" },
            { 'name': 'Homer', "email":"home@simpsons.com",  "phone":"555-222-1244"  },
            { 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254"  }
        ]},
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        }
    });
    
    
    Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        columns: [
            { text: 'Name',  dataIndex: 'name' },
            { text: 'Email', dataIndex: 'email', flex: 1 },
            { text: 'Phone', dataIndex: 'phone' }
        ],
        height: 200,
        width: 400,
        renderTo: Ext.getBody()
        , tbar: [{
            text: 'Enable Selection'
            , enableToggle: true
            , toggleHandler: function (btn, pressed) {
                var v = btn.up('grid').view.el;
                
                v.selectable();
            }
        }]
    });

  3. #2
    Sencha User
    Join Date
    Jul 2011
    Posts
    72
    Vote Rating
    4
    Answers
    2
    ragecf is on a distinguished road

      0  

    Default I did a test.

    I did a test:

    Code:
    grid = Ext.create('Ext.grid.Panel', {
    ...... viewConfig: {
    stripeRows: true, enableTextSelection: false
    }, tbar: Ext.create('Ext.toolbar.Toolbar', {
    items: [{
    text: '', handler: this.onEnableSelection, scope: this, tooltip:'Enable Text Selection', enableToggle: true
    }]
    })
    } onEnableSelection = function(btn) { grid.view.normalView.stripeRows = btn.pressed; // This works fine. grid.view.normalView.enableTextSelection = btn.pressed; // This can not work. How to modify? grid.view.refresh(); }

  4. #3
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    6,120
    Vote Rating
    227
    Answers
    493
    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 slemmon has much to be proud of

      0  

    Default

    See if this helps. Worked for me in Firefox.

    Code:
    Ext.create('Ext.data.Store', {
        storeId:'simpsonsStore',
        fields:['name', 'email', 'phone'],
        data:{'items':[
            { 'name': 'Lisa',  "email":"lisa@simpsons.com",  "phone":"555-111-1224"  },
            { 'name': 'Bart',  "email":"bart@simpsons.com",  "phone":"555-222-1234" },
            { 'name': 'Homer', "email":"home@simpsons.com",  "phone":"555-222-1244"  },
            { 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254"  }
        ]},
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        }
    });
    
    
    Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        columns: [
            { text: 'Name',  dataIndex: 'name' },
            { text: 'Email', dataIndex: 'email', flex: 1 },
            { text: 'Phone', dataIndex: 'phone' }
        ],
        height: 200,
        width: 400,
        renderTo: Ext.getBody()
        , tbar: [{
            text: 'Enable Selection'
            , enableToggle: true
            , toggleHandler: function (btn, pressed) {
                var v = btn.up('grid').view.el;
                
                v.selectable();
            }
        }]
    });

  5. #4
    Sencha User
    Join Date
    Jul 2011
    Posts
    72
    Vote Rating
    4
    Answers
    2
    ragecf is on a distinguished road

      0  

    Default It's great.

    Thanks a lot.

    And a little change in my code:

    Code:
            , toggleHandler: function (btn, pressed) {
                var v = btn.up('grid').view.normalView.el;     //because enableLocking is true in my code
    
    if (pressed) {
    v.selectable();
    } else { v.unselectable(); }
    }

  6. #5
    Sencha User
    Join Date
    Jul 2011
    Posts
    72
    Vote Rating
    4
    Answers
    2
    ragecf is on a distinguished road

      0  

    Default

    Quote Originally Posted by slemmon View Post
    See if this helps. Worked for me in Firefox.

    Code:
    Ext.create('Ext.data.Store', {
        storeId:'simpsonsStore',
        fields:['name', 'email', 'phone'],
        data:{'items':[
            { 'name': 'Lisa',  "email":"lisa@simpsons.com",  "phone":"555-111-1224"  },
            { 'name': 'Bart',  "email":"bart@simpsons.com",  "phone":"555-222-1234" },
            { 'name': 'Homer', "email":"home@simpsons.com",  "phone":"555-222-1244"  },
            { 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254"  }
        ]},
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        }
    });
    
    
    Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        columns: [
            { text: 'Name',  dataIndex: 'name' },
            { text: 'Email', dataIndex: 'email', flex: 1 },
            { text: 'Phone', dataIndex: 'phone' }
        ],
        height: 200,
        width: 400,
        renderTo: Ext.getBody()
        , tbar: [{
            text: 'Enable Selection'
            , enableToggle: true
            , toggleHandler: function (btn, pressed) {
                var v = btn.up('grid').view.el;
                
                v.selectable();
            }
        }]
    });

    Can not work in chrome and ie8 (winxp)

Thread Participants: 1