PDA

View Full Version : Ext.define('mygrid'...) vs var grid



clemence
25 Oct 2011, 2:40 PM
How can I get my grid if I define it with the new syntax?
In the following code, I don't manage to get my grid to remove the selections (???.getSelectionModel().getSelection()). Ext.getCmp('gridchain').getSelectionModel().getSelection() doesn't work.



Ext.define('APP.view.chain.list' , {

extend: 'Ext.grid.Panel',
alias : 'widget.chainlist',
title : 'All chains',
id:'gridchain',
store: 'Chains',
dockedItems: [{
xtype: 'toolbar',
items: [{
iconCls: 'icon-add',
text: 'Add',
handler: function (){
formchain.resetfields();
}
}, {
iconCls: 'icon-delete',
text: 'Delete',
disabled: true,
itemId: 'delete',
handler: function(){
????
}
}]}]
,
columns: [{
header: 'Name',
dataIndex: 'chain_name',
flex: 1
}],
listeners:{
selectionchange: function(model, records) {

this.down('#delete').setDisabled(false);
if (records[0]) {
formchain.loadRecord(records[0]);
}

}
}
});

skirtle
25 Oct 2011, 3:19 PM
Ext.define() is the 'new syntax' for Ext.extend(). You'd have exactly the same problem if you used Ext.extend() too. The 'new syntax' for instantiating an object, formerly done using the new operator, is to use Ext.create(). From the title of your post I wonder whether you're confusing the two.

You've got a number of options. The MVC is one possibility. I think the most direct way would be something like this:


handler: function() {
// Component query based on xtype (alias)
var grid = this.up('chainlist');
...
}

Using Ext.getCmp() should have worked, though I would advise against using Ext.getCmp() with a static id like that. The use of static ids was bad practice in previous versions but with the introduction of component queries it's not even a necessarily evil.

clemence
25 Oct 2011, 4:52 PM
thank you for your response.

I should have said it is working but I have nothing in the selection:

var selection =this.up('chainlist').getSelectionModel().getSelection();
or
var selection = Ext.getCmp('gridchain').getSelectionModel().getSelection();

give [ ] on a console log. But there is a selection because "console.log(this.getSelectionModel().getSelection())" in the selectionchange event give me the record...

If I take the code in the restful example which use the following syntax : var grid = Ext.create('Ext.grid.Panel', {...});
they use that :
var selection = grid.getView().getSelectionModel().getSelection()[0];

and if I use Ext.define('APP.view.chain.list' , {...}) I can't use the same code I mean something like this :
this.up('chainlist').getView().getSelectionModel().getSelection();

I am quite lost with this syntax... (anyway I use MVC and rest)