PDA

View Full Version : Grid SelectionModel: how to know if it was keypress or mousedown



ltisnegrimaud
3 Sep 2015, 6:25 AM
Hi,

I have searched about this without success.
I have a grid with a RowModel set as SelectionModel. Is there a way to know in the select event listener if the user actually pressed a key or clicked with the mouse?

My code is :




var grid = Ext.create('Ext.grid.Panel', {
store: store,
selModel: Ext.create('Ext.selection.RowModel',{
mode: 'SINGLE',
listeners:{
select: function(selmodel,record,index){
// need to know if it was a keypress or mousedown
}
}
}),
columns: columns,
columnLines: true,
width: 600,
height: 300,
frame: true,
title: 'Company',
margin: '0 0 20 0',
renderTo: Ext.getBody()
});


I have set up a fiddle with this: https://fiddle.sencha.com/#fiddle/tae

I (https://fiddle.sencha.com/#fiddle/tae) think I can extend Ext.selection.RowModel but maybe there is an easier way to achieve that!

Thanks in advance.

jdkhamba
4 Sep 2015, 4:15 AM
By the time the select event is fired it is probably too late to know what exactly initiated it.

Take a look at beforecellkeydown event:

http://docs.sencha.com/extjs/4.2.0/#!/api/Ext.grid.Panel-event-beforecellkeydown

Also beforecellmousedownevent:

http://docs.sencha.com/extjs/4.2.0/#!/api/Ext.grid.Panel-event-beforecellmousedown

These might help you to differentiate between the two.

ltisnegrimaud
4 Sep 2015, 5:29 AM
Thanks you very much jdkhamba!

I think it can do the job with the events you pointed me to!
Here is my code. It is probably not well written but it does what I need to



var grid = Ext.create('Ext.grid.Panel', {
store:store,
selModel: Ext.create('Ext.selection.RowModel',{
mode: 'SINGLE',
listeners:{
select: function(selmodel,record,index){
if(grid.keydown)
{
alert('It was a key pressed');
}
else if(grid.mousedown)
{
alert('it was a mouse click');
}
}
}
}),
columns:columns,
columnLines: true,
width: 700,
height: 300,
frame: true,
title: 'Company',
margin: '0 0 20 0',
renderTo: Ext.getBody(),
listeners:{
beforecellkeydown: function(){
//user is pressing a key
grid.keydown = true;
grid.mousedown = false;
},
beforecellmousedown: function(){
//user is clicking with mouse
grid.keydown = false;
grid.mousedown = true;
}
}
});