PDA

View Full Version : Error when setting SegmentedButton state via setPressed (0.97)



mnjacobs
21 Oct 2010, 12:40 PM
I am attempting to set the pressed state of a SegmentedButton, but always get the following error within the setPressed code:

Uncaught TypeError: Cannot call method 'addClass' of undefined

Here is example onReady code to replicate the approach. Is there a problem with how I am doing it?



var panel = new Ext.Panel({
fullscreen: true,
items:[
{
xtype: 'segmentedbutton',
allowMultiple: false,
items: [{
text: 'Option 1',
pressed: false
},
{
text: 'Option 2',
pressed: false
}
],
listeners : {
toggle : function(container, button, pressed){
console.log("User toggled the '" + button.text + "' button: " + (pressed ? 'on' : 'off'));
},
activate: function(segmentedButton){
console.log('activate'); // never called
segmentedButton.setPressed(0, true, true);
},
afterrender : function(segmentedButton){
console.log('afterrender');
segmentedButton.setPressed(0, true, true); // error
}
}
}
]

});
panel.show();

Gunny
21 Mar 2011, 11:51 AM
Hi all,
I have the same problem, someone has the solution?

Thanks.

tetchen9
8 Jul 2011, 12:31 AM
Up!
In this line in Ext.SegmentedButton in function setPressed
btn.el.addCls(me.pressedCls);

Uncaught TypeError: Cannot call method 'addCls' of undefined
Ext.SegmentedButton.Ext.extend.setPressedsencha-touch-debug.js:21948
(anonymous function)ExpensesItemComponents.js:105
Ext.extend.eachsencha-touch-debug.js:1433
Ext.apply.items.handlerExpensesItemComponents.js:94
Ext.Button.Ext.extend.callHandlersencha-touch-debug.js:21822
(anonymous function)

elmasse
8 Jul 2011, 5:00 AM
I had the same issue. (Using SenchaTouch 1.1)
The problem arises when you call setPressed and the SegmentedButton is not layed out.
Here is my fix:



/**
* Ext.SegmentedButton
*/
Ext.SegmentedButton.override({

addPressedCls: function(btn){
btn.el && btn.el.addCls(this.pressedCls);
},

removePressedCls: function(btn){
btn.el && btn.el.removeCls(this.pressedCls);
},

/**
* Activates a button
* @param {Number/String/Button} position/id/button. The button to activate.
* @param {Boolean} pressed if defined, sets the pressed state of the button,
* otherwise the pressed state is toggled
* @param {Boolean} suppressEvents true to suppress toggle events during the action.
* If allowMultiple is true, then setPressed will toggle the button state.
*/
setPressed : function(btn, pressed, suppressEvents) {
var me = this;

btn = me.getComponent(btn);
if (!btn || !btn.isButton || btn.disabled) {
return;
}

if (!Ext.isBoolean(pressed)) {
pressed = !btn.pressed;
}

if (pressed) {
if (!me.allowMultiple) {
if (me.pressedButton && me.pressedButton !== btn) {
me.removePressedCls(me.pressedButton);
me.pressedButton.pressed = false;
if (suppressEvents !== true) {
me.fireEvent('toggle', me, me.pressedButton, false);
}
}
me.pressedButton = btn;
}

me.addPressedCls(btn);
btn.pressed = true;
btn.preventCancel = true;
if (me.initialized && suppressEvents !== true) {
me.fireEvent('toggle', me, btn, true);
}
}
else if (!pressed) {
if (!me.allowMultiple && btn === me.pressedButton) {
me.pressedButton = null;
}

if (btn.pressed) {
me.removePressedCls(btn);
btn.pressed = false;
if (suppressEvents !== true) {
me.fireEvent('toggle', me, btn, false);
}
}
}

if (me.allowMultiple && me.initialized) {
me.pressedButtons = me.getPressedButtons();
}
}

});


Ugly, but it works for me.

Max