PDA

View Full Version : Question on itemSelector



ValerieB
13 Oct 2012, 5:55 AM
I created a panel (card layout) using an itemSelector as an item. I've been tryingt to extract the selected items, but unsuccessfully so far.
Can anyone tell me what's wrong with my code?

My view:


Ext.define('XXX.view.plot.Plot', {
//
extend: 'Ext.form.Panel',
alias : 'widget.plotpanel',
requires: [
//'Ext.form.*',
//'Ext.data.*',
'Ext.layout.container.Card',
'Ext.form.Panel',
'Ext.ux.form.ItemSelector',
'Lvisa.model.Sa'
],
border: 'false',
layout: 'card',
autoShow: true,
initComponent: function(){
this.items=

[{ xtype: 'panel',
id:"p0",
border: false,
layout:'card',
items: [

{ xtype: 'itemselector',
id: "card0",
name: 'card0',
width:300,
height:300,
anchor: '100%',
store: Ext.create('XXX.store.Sas'),
model: 'XXX.model.Sa',
imagePath: '../resources/extjs-4.1.1/src/ux/images/',
displayField: 'name',
valueField: 'name',
allowBlank: false,
msgTarget: 'side',
maxSelections:3,
minSelections:1,
fromTitle: 'Available',
toTitle: 'Selected'
}]},
{
xtype: 'itemselector',
id: "card1",
name: 'card1',
width:300,
height:300,
anchor: '100%',
store: Ext.create('XXX.store.Species'),
imagePath: '../resources/extjs-4.1.1/src/ux/images/',
displayField: 'name',
valueField: 'name',
allowBlank: false,
msgTarget: 'side',
maxSelections:3,
minSelections:1,
fromTitle: 'Available1',
toTitle: 'Selected1'

},

}]; //eo items


this.buttons = [
{
text: 'Back',
scope: this,
action:'back',
disabled: true
},{
text: 'Clear',
scope: this,
action:'clear'
}, {
text: 'Next',
scope: this,
action:'next'
}];

this.callParent(arguments);


}// eo initComponent

}) // eo Ext.define

My controller:


Ext.define('XXX.controller.Plot', {
extend: 'Ext.app.Controller',
stores: ['Sas'],
models: ['Sa'],
views: ['plot.Plot'],
requires: [
'XXX.view.plot.Plot',
'XXX.model.Sa',
'XXX.store.Sas',
]

init: function() {

this.control({
'viewport > plotpanel': {
beforerender: this.loadData
},
'viewport > panel': {
render: this.loadData
},
'plotpanel button[action=clear]': {
click: this.clearFields
},
'plotpanel button[action=next]': {
click: this.nextStep
},
'plotpanel button[action=back]': {
click: this.prevStep
}
}, this);

this.control();

},//eo init


clearFields:function(){
var field = Ext.getCmp("card0");
if (!field.disabled) {
field.clearValue();
}
},

nextStep:function(){
var selectedLayoutId;
var selectedItems;

if (Ext.getCmp('p0').getLayout().getActiveItem().id == "card0"){

selectedLayoutId= Ext.getCmp (Ext.getCmp('p0').getLayout().getActiveItem().id);
selectedItems = selectedLayoutId.getSelections();

console.log(selectedItems);}

else console.log("fail test1");
},

prevStep:function(){
p.getLayout().setActiveItem(0);

},

});//eo define



Thanks for any help!!!:)

mitchellsimoens
15 Oct 2012, 12:55 PM
getValue method should return the values if that's what you need. Or else you can just get what is in the store for that selector