PDA

View Full Version : GridPanel: property enableDragDrop?



fenuk
22 Nov 2010, 4:38 AM
I have this simple code:


Ext.onReady(function(){

var oStoreDrag = new Ext.data.JsonStore({
fields: ['name', 'surname'],

data: [
{name:"name1", surname:"surname1"},
{name: "name2", surname: "surname2"},
{name: "name3", surname: "surname3"},
{name: "name4", surname: "surname4"}
]}
)

var oGridDrag = new Ext.grid.GridPanel({

title : 'Drag',
enableDragDrop : true,
region : 'center',
height : 350,
store : oStoreDrag,
split: true,
columns : [{header : "Name", dataIndex : "name"},{header : "SurName", dataIndex : "surname"}]
})

var oView = new Ext.Viewport({
layout : 'border',
items: oGridDrag
})
})


and i have problem, when set property enableDragDrop - true.
When i selected all rows in table - i can't unselect rows.

when i set property enableDragDrop - false, and selected all rows, i can unselect rows.

so, what wrong?

fenuk
22 Nov 2010, 11:09 PM
up.

Condor
23 Nov 2010, 2:37 AM
This was a bug in older versions of Ext. Which version are you using?

fenuk
23 Nov 2010, 6:21 AM
3.3.0

Condor
23 Nov 2010, 6:35 AM
I'm surprised you even can select rows when enableDragDrop or enableDrag is set.

Could you try:

Ext.override(Ext.grid.RowSelectionModel, {
initEvents : function(){
if(!this.grid.enableDragDrop && !this.grid.enableDrag){
this.grid.on('rowmousedown', this.handleMouseDown, this);
} else {
this.grid.on('rowclick', this.handleMouseDown, this);
}
this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), {
up: this.onKeyPress,
down: this.onKeyPress,
scope: this
});
this.grid.getView().on({
scope: this,
refresh: this.onRefresh,
rowupdated: this.onRowUpdated,
rowremoved: this.onRemove
});
}
});
Warning: Completely untested code!

Skippy1988
3 Jan 2011, 1:19 AM
I use an extension using this code snippet.

Now the selection of grid rows works like the users will expect it.

Thank you.

PS: This solution should be published because it's not easy to find it within this thread.


Best regards

Mirko

Skippy1988
3 Jan 2011, 10:54 PM
I'm sorry for my premature post.

The solution doesn't work correctly because the <b>handleMouseDown</b> will be called twice for a dragging-enabled grid.
So the selection with the Ctrl key doesn't work because the second call overrides the selection of the first one.

My solution is the following:


Ext.ux.grid.RowSelectionModel = Ext.extend( Ext.grid.RowSelectionModel, {
initEvents : function(){

if(!this.grid.enableDragDrop && !this.grid.enableDrag){
this.grid.on('rowmousedown', this.handleMouseDown, this);
} else {
this.grid.on('rowclick', function(g, rowIndex, e) {
this.handleMouseDown(g, rowIndex, e, true);
}, this );
}


this.rowNav = new Ext.KeyNav(this.grid.getGridEl(), {
'up' : function(e){
if(!e.shiftKey || this.singleSelect){
this.selectPrevious(false);
}else if(this.last !== false && this.lastActive !== false){
var last = this.last;
this.selectRange(this.last, this.lastActive-1);
this.grid.getView().focusRow(this.lastActive);
if(last !== false){
this.last = last;
}
}else{
this.selectFirstRow();
}
},
'down' : function(e){
if(!e.shiftKey || this.singleSelect){
this.selectNext(false);
}else if(this.last !== false && this.lastActive !== false){
var last = this.last;
this.selectRange(this.last, this.lastActive+1);
this.grid.getView().focusRow(this.lastActive);
if(last !== false){
this.last = last;
}
}else{
this.selectFirstRow();
}
},
scope: this
});

this.grid.getView().on({
scope: this,
refresh: this.onRefresh,
rowupdated: this.onRowUpdated,
rowremoved: this.onRemove
});
},
handleMouseDown : function(g, rowIndex, e, isDrag){
if(e.button !== 0 || this.isLocked()){
return;
} else if (isDrag && e.hasModifier()) {
return;
}
var view = this.grid.getView();
if(e.shiftKey && !this.singleSelect && this.last !== false){
var last = this.last;
this.selectRange(last, rowIndex, e.ctrlKey);
this.last = last;
view.focusRow(rowIndex);
}else{
var isSelected = this.isSelected(rowIndex);
if(e.ctrlKey && isSelected){
this.deselectRow(rowIndex);
}else if(!isSelected || this.getCount() > 1){
this.selectRow(rowIndex, e.ctrlKey || e.shiftKey);
view.focusRow(rowIndex);
}
}
}
});


Best regards

Mirko