PDA

View Full Version : Bug? Selecting row in one grid selects row in an unrelated grid



freshyseth
31 Oct 2011, 11:12 AM
I'm using ext-4.0.7 (same issue w/ext-4.0.6 as well) and am having a weird issue with a couple of grids. Right now I have two windows, one each with a grid in it. The grids are coming from two completely different views and were created with completely different Ext Designer files. The stores are also completely separate stores.

However, when I select a row in one grid (record index of 0) then the record with the same index is "highlighted" in the other grid. Or selecting record index of 252 selects the record with index 252 in the other grid. This appears to be only visual as I've added "select" listeners to both the grids and even though the record appears to be "highlighted" in the other grid the "select" event is never fired for that grid. Only for the grid I am actually selecting on.

Also, it is a direct correlation of the indices of each record as when I have all 302 records loaded in the first grid selecting 303 in the other does nothing in the first grid. However, from 302 up to 0 the other grid displays the select behavior.

Anyone else having this issue? If not, then I'll post some code. Because I'm using Ext Designer there are both "view/ui" and "view" files to put up as well as two different controllers for listening to these two completely different grids.

Thanks,

freshyseth

darthwes
31 Oct 2011, 11:28 AM
Show the view declarations and the view/window that instantiates the grids, please. (should be controller/Main, and view/Grid1, view/Grid2, depending on what you've named your grid extensions (Ext.define)). Sounds like you've got an id problem or using the same instance of the selection model on both grids, but without said code, is hard to actually help. Have a good day!

mitchellsimoens
1 Nov 2011, 4:54 AM
This usually is because when you used Ext.define, you specified your selection model outside a method so the selection model is then shared..



Ext.define('MyGrid', {
extend : 'Ext.grid.Panel',

selModel : Ext.create('Ext.selection.RowModel', {
allowDeselect : true
}),

/* ... */
});

But you should do this instead:


Ext.define('MyGrid', {
extend : 'Ext.grid.Panel',

initComponent: function() {
Ext.apply(this, {
/* ... */
selModel : Ext.create('Ext.selection.RowModel', {
allowDeselect : true
})
});

this.callParent(arguments);
},

/* ... */
});

freshyseth
1 Nov 2011, 9:10 AM
That's the confusing part for me. These Ext.defines are coming from Ext Designer 1.2. One grid is created as a child item of a parent panel as this:


Ext.define('VMS.view.ui.UserManagement', {
extend: 'Ext.panel.Panel',
layout: {
type: 'border'
},
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [
{
xtype: 'gridpanel',
id: 'umUserGrid',
columns: [
{
xtype: 'numbercolumn',
dataIndex: 'UserID',
flex: 1,
text: 'User ID',
format: 0
},
{
xtype: 'gridcolumn',
dataIndex: 'Username',
flex: 2,
text: 'Username'
},
{
xtype: 'gridcolumn',
dataIndex: 'FirstName',
flex: 2,
text: 'First Name'
},
{
xtype: 'gridcolumn',
dataIndex: 'LastName',
flex: 2,
text: 'Last Name'
},
{
xtype: 'gridcolumn',
dataIndex: 'Email',
flex: 4,
text: 'Email'
}
],
viewConfig: {
border: 0
}
}
]
});
me.callParent(arguments);
}
});


And the other like this:


Ext.define('VMS.view.ui.AllTasks', {
extend: 'Ext.grid.Panel',

initComponent: function() {
var me = this;

Ext.applyIf(me, {
viewConfig: {
},
columns: [
{
xtype: 'numbercolumn',
width: 60,
dataIndex: 'TaskID',
text: 'Task ID',
format: '0,000'
},
{
xtype: 'gridcolumn',
dataIndex: 'Title',
flex: 5,
text: 'Title'
},
{
xtype: 'gridcolumn',
dataIndex: 'Status',
flex: 1,
text: 'Status'
},
{
xtype: 'gridcolumn',
dataIndex: 'Origin',
flex: 1,
text: 'Origin'
},
{
xtype: 'datecolumn',
dataIndex: 'DueDate',
flex: 1.5,
text: 'Due Date'
},
{
xtype: 'gridcolumn',
dataIndex: '_PriorityReadable',
flex: 0.5,
text: 'Priority'
},
{
xtype: 'gridcolumn',
dataIndex: 'Category',
flex: 2,
text: 'Category'
},
{
xtype: 'gridcolumn',
dataIndex: '_AssigneeReadable',
flex: 2,
text: 'Assignee'
},
{
xtype: 'booleancolumn',
width: 16,
dataIndex: '__archived',
text: 'X',
falseText: '',
trueText: 'X'
}
]
});

me.callParent(arguments);
}
});


As you can tell from the define() method these are the "ui" files that the view files extend from as created by Ext Designer. No selection model is defined.