Hi,
After the upgrade to version 0.98 following problems arise.
When Panel on the Carousel has the toolbar, if you delete card and create, the following error occurs.
Uncaught TypeError: Cannot read property 'parentNode' of undefined ext-touch-debug.js:25504
The top left of the toolbar button will delete the second card and create.
It's operated normally at Version 0.97.
The code is shown below.
Code:
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>test</title>
<!--link rel="stylesheet" href="../../resources/css/sencha-touch.css" type="text/css"-->
<link rel="stylesheet" href="../../resources/css/apple.css" type="text/css">
<script type="text/javascript" src="../../ext-touch-debug.js"></script>
<script type="text/javascript">
Ext.ns('test');
test.MainPanel = Ext.extend(Ext.Carousel, {
fullscreen: true,
layout: 'fit',
activeItem: 0,
defaults: {
cls: 'card'
},
initComponent: function() {
this.dockedItems = [{
xtype: 'toolbar',
dock: 'top',
items: [{
text: '111',
scope: this,
handler: this.onButtonTap
}, {
text: '222',
scope: this,
handler: this.onButtonTap
}],
title: 'Main Title'
}];
this.items = [{
html: 'Card 1',
style: {background: '#fff'}
}, {
html: 'Card 2',
style: {background: '#f00'}
}];
test.MainPanel.superclass.initComponent.call(this);
},
onButtonTap: function(btn, e) {
var iCardSize = this.layout.getLayoutItems().length;
for (var iCardIdx = iCardSize-1; iCardIdx >= 1; iCardIdx--) {
this.remove(this.getComponent(iCardIdx));
}
var panel = new test.SubPanel({color: btn.text});
this.add(panel);
this.doLayout();
this.next();
}
});
test.SubPanel = Ext.extend(Ext.form.FormPanel, {
html: 'Card',
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'Sub title'
}],
// @override
initComponent: function() {
this.html = this.html + this.color,
test.SubPanel.superclass.initComponent.call(this);
}
});
Ext.setup({
tabletStartupScreen: 'resources/img/tablet_startup.png',
phoneStartupScreen: 'resources/img/phone_startup.png',
icon: 'resources/img/icon.png',
glossOnIcon: false,
onReady: function() {
this.mainPanel = new test.MainPanel();
}
});
</script>
</head>
<body></body>
</html>