mardi 24 février 2015

ListItem is somehow disabled again after call to enable()

So far I have this working with the code below, but when I call "me.enable()" from ListItem.updateRecord(), the dom element looks enabled (x-deckitem-disabled class is removed, isDisabled() returns false), but the item is being re-enabled somewhere after the call to updateRecord().


Can I prevent the item from being disabled? Is there a better way to do this? Possibly to bind the list item's enabled/disabled state to the 'isPurchased' value in the model?



Code:



Ext.define('Deck', {
extend: 'Ext.data.Model',
config: {
fields: ['edition_title', 'game_title', 'sku', 'isPurchased', 'cards']
}
});

Ext.define('Speakeasy.view.DeckItem', {
extend: 'Ext.dataview.component.ListItem',
alias: 'widget.deckitem',
config: {
layout: {
type: 'vbox',
pack: 'justify',
// align: 'center',
},
hideAnimation: 'slideOut',
disabled: true,
items: [
{
xtype: 'component',
itemId: 'titleCmp',
__itemTpl: new Ext.XTemplate(
'<tpl for=".">',
'<tpl if="isPurchased">',
'<span class="deck-price">{price}</span>',
'</tpl>',
'</tpl>'
),
docked: 'left'
},
{
cls: 'buy-button-container',
xtype: 'container',
docked: 'right',
items: [
{
xtype: 'button',
text: 'Buy',
itemId: 'buy-button',
cls: 'buy-button',
hideAnimation: 'fadeOut',
showAnimation: 'slideIn',
handler: function(x, e) {
var sku = this.up('deckitem').getRecord().get('sku');
decksController.Purchase(sku);
e.stopEvent();
}
}
]
}
]
},
updateRecord: function(record) {
var me = this;
var buyButton = me.down('#buy-button');
if(record.get('isPurchased')) {
buyButton.hide();
if(me.isDisabled())
me.enable();
} else {
buyButton.show();
if(!me.isDisabled())
me.disabled();
}


if(record.get('price')) {
buyButton.setText(record.get('price'));
} else {
buyButton.setText(buyButton.getInitialConfig('text'));
}


me.callParent(arguments);
}
});


Ext.define('Speakeasy.view.Decks', {
extend: 'Ext.List',
xtype: 'decks',
alias: 'widget.decksview',
requires: [
'Ext.TitleBar',
'Ext.data.Store'
],
config: {
id: 'decksview',
itemId: 'decksview',
tabBarPosition: 'bottom',
layout: {
type: 'fit'
},
defaultType: 'deckitem',
// useComponents: true,
grouped: true,
store: {
model: 'Deck',
sorters: 'game_title',
fields: ['sku', 'edition_title', 'game_title'],
grouper: {
groupFn: function(record) {
var title = record.get('game_title');
if(title.split(' ')[0].toLowerCase().indexOf('the') == 0) {
return title.split(' ')[1][0];
} else {
return title[0];
}
}
},
data: Speakeasy.DECKS_LIST
},


itemTpl: '{game_title}',


items: [
{
docked: 'top',
xtype: 'titlebar',
title: 'Speakeasy',
// items: {
// xtype: 'button',
// text: 'Log Off',
// itemId: 'logOffButton',
// align: 'right'
// }
}
],


listeners: [
{
delegate: '#logOffButton',
event: 'tap',
fn: 'onLogOffButtonTap'
}
]
},


initialize: function() {
this.callParent(arguments);
// this is here to still allow a click to the child buy button
this.addBeforeListener('select', function(list, model, x, y, z) {
if(model.get('isPurchased') == false)
return false;
});
},


onLogOffButtonTap: function() {
this.fireEvent('signOffCommand');
}
});





ListItem is somehow disabled again after call to enable()

Aucun commentaire:

Enregistrer un commentaire