PDA

View Full Version : Grid view drag drop - view itemSelector undefined



tracytn
26 Nov 2014, 12:03 PM
I am using the MVC framework. I need to implement a grid with rows that can be reordered. The gridviewdragdrop plugin looks like it's simple enough to implement. However, right of the bat I am already encountering an error.

When I click on a row (not even dragging), I get and error view.getItemSelector is not a function. It looks like when the row is clicked, onItemMouseDown is called which then calls getDragData. In debug mode, the value for view.itemSelector is "tr.x-grid-row". However, inside getDragData, view.itemSelector is undefined. I'm puzzled as to how it to lost in between the calls. Is there something obvious that I am missing?

Unfortunately, I cannot post my full code here. But this is closed to what I have.



Ext.define('myproject.employees') {
model: 'mypoject.employee',
data: [
{name: 'john', title: 'system engineer'},
{name: 'jane', title: 'manager'}
]
}

Ext.define('myproject.employeeGrid') {
requires: [
'myproject.employees',
'Ext.grid.plugin.DragDrop'
],

plugins: [
{
ptype: 'gridviewdragdrop'
}
],

store: 'myproject.employees',
layout: 'fit'

initComponent: function() {
stateful: true,
cls: 'custom-grid'
columns: [
{
text: 'Name',
dataIndex: 'name',
},
{
text: 'Job Title',
dataIndex: 'title',
}
]
}

this.callParent();
}

lumberjack
1 Dec 2014, 10:53 AM
Unlike most of the other grid-related plugins, the gridviewdragdrop (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.grid.plugin.DragDrop) plugin needs to be applied through the grid's viewConfig (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.grid.Panel-cfg-viewConfig) property, not through the grid's plugins (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.grid.Panel-cfg-plugins) property. I've provided this fiddle as an example.

Thanks,
Brian

e94

tracytn
1 Dec 2014, 11:02 AM
Thanks Brian! This works!

I was able to bypass the previous error. But when attempting to drag the row, the x-out icon remains and I am unable to drop the row. Any other "gotchas" that I should watch out for?

lumberjack
1 Dec 2014, 12:22 PM
Can you provide a screen shot of the x-out persisting? What does your updated code look like?

Thanks,
Brian

tracytn
1 Dec 2014, 12:35 PM
Brian, I figured out that it didn't work because I was including ext-all-debug.js (in trying to debug the previous problem). I ended up switching over to ext-all.js and now it works. Weird!

Thanks for your help! I am new to the forum, so I don't know how it works but please mark this question as answered. Thanks!