PDA

View Full Version : Cell click event is not getting triggered on Locked Grid on checkcolumn



agarapati
20 May 2015, 12:46 AM
Cell click event is not getting triggered on Grid with locked columns with xytpe checkcolumn. Below is how I coded Grid. THe event is getting triggered for other columns



xtype: 'grid',
height:370,
autoScroll: true,
forceFit: true,
enableColumnMove: false,
selType: 'cellmodel',
viewConfig: {
emptyText: 'No data or records found'
},
columns: [{
xtype: 'checkcolumn',
header: 'Select to<br/>Compare',
dataIndex: 'active',
width:90,
locked: true,
getClass: function() {
return '';
}
},{
text: 'Cusip/<br/>Ticker',
dataIndex: 'Cusip/ Ticker',
width:65,
locked: true,

},
{
text: 'Name',
dataIndex: 'name',
width:228,
locked: true
}, {
text: 'Download <br>Docs',
width:100,
sortable:false,
align:"center",
locked: true
}]

jdkhamba
20 May 2015, 5:13 AM
Might wanna use the cellediting plugin instead:

http://docs.sencha.com/extjs/4.2.0/#!/example/build/KitchenSink/ext-theme-neptune/#cell-editing

agarapati
20 May 2015, 5:57 AM
No luck with cell edit also

f.baron
20 May 2015, 6:52 AM
If you need to handle check changes you should use the "checkchange" event of the checkcolumn component.



...
columns: [{
xtype: 'checkcolumn',
listeners: {
checkchange: function(cmp, rowIndex, checked) {
var grid = cmp.up('grid'),
record = grid.getStore().getAt(rowIndex);
...
}
}
}]

agarapati
25 May 2015, 12:55 AM
Hi, If we write listeners in view. It is working fine but as per our coding standards we need to bind events from the controller. Below are two scenarios we observed1. I observed is if the columns of grid are coded in the view, the event is getting triggered.2. If we add columns also dynamically from controller and use "reconfigure" the event is not getting triggered.Any idea how to make trigger work even if the columns are added using reconfigure method.?

f.baron
25 May 2015, 5:04 AM
It seems to be a problem in listener definition, could you post your code?

agarapati
10 Jun 2015, 1:30 AM
Hi Baron,

I created the working copy in Fiddle. Below is the url and view is in app/view/Landingpage.js

https://fiddle.sencha.com/#fiddle/oc5

(https://fiddle.sencha.com/#fiddle/oc5)I cant use listeners in the columns definition it is our project standards.

f.baron
10 Jun 2015, 5:04 AM
I changed "app.js" to load controller and I added the "chackchange" handler.

https://fiddle.sencha.com/#fiddle/ocf

app.js


Ext.application({
name : 'RI',

appFolder: 'app',

views: ['Landing'],

controllers: ['Landing'],

launch: function() {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: {
xtype: 'landing'
}
});
}
});


controller/Landing.js


Ext.define('RI.controller.Landing', {

extend: 'Ext.app.Controller',

init: function() {
this.control({
'checkcolumn': {
checkchange: this.onCheckChange
}
});
},

onCheckChange: function(cmp, rowIndex, checked) {
var grid = cmp.up('grid'),
record = grid.getStore().getAt(rowIndex);
window.alert((checked ? 'Checked' : 'Unchecked') + ' ' + record.get('Name'));
}
});

agarapati
10 Jun 2015, 10:15 PM
Thanks Baron its working perfect :)