Enable Text Selection By a button

[ragecf]

Hi All,

Happy new year!

I wanted to enable/disable textselection by a button.

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.

[ragecf]

I did a test:

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();

}

[slemmon]

See if this helps. Worked for me in Firefox.

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();
        }
    }]
});

[ragecf]

Thanks a lot.

And a little change in my 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();
}
}

[ragecf]

See if this helps. Worked for me in Firefox.

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)