我是Sencha Touch2的新手,在listitem tap上将数据从我的Controller传递到Floating面板时遇到问题。这是我的控制器实现代码:
Ext.define('CustomList.controller.Main', {
extend: 'Ext.app.Controller',
requires:['CustomList.view.DatePanel'],
config: {
refs: {
listView: 'listitems'
},
control: {
'main test2 list': {
activate: 'onActivate',
itemtap: 'onItemTap'
}
}
},
onActivate: function() {
console.log('Main container is active');
},
onItemTap: function(view, index, target, record, event) {
console.log('Item was tapped on the Data View');
Ext.Viewport.add({
xtype: 'DatePanel'
});
}
});
能够在控制器中获取数据,而DatePanel.js是我的浮动面板。 DatePanel.js:
Ext.define('CustomList.view.DatePanel', {
extend: 'Ext.Panel',
alias: 'widget.DatePanel',
xtype:'datepanel',
config: {
itemid:'DatePanel',
modal:true,
centered: true,
hideOnMaskTap:true,
width:'500px',
height:'650px',
items:[
{
styleHtmlCls:'homepage',
tpl:'<h4>{name3}</h4>'
},
{
xtype:'toolbar',
docked:'bottom',
items:[{
text:'OK',
ui:'confirm',
action:'ShowTurnOverReport',
listeners : {
tap : function() {
console.log('Ok');
}
}
},
{
text:'Cancel',
ui:'confirm',
action:'Cancel',
listeners : {
tap : function() {
console.log('Cancel');
var panelToDestroy = Ext.getCmp('datepanel');
panelToDestroy.destroy();
Ext.Viewport.add(Ext.create('CustomList.view.Test2'));//Test.js is my list Panel
}
}
}]
}
]
}
});
帮我解决“取消”按钮上的面板。 谁能帮帮我吗。感谢。
答案 0 :(得分:2)
首先创建要添加的面板实例。
var floatingDatePanel = Ext.create('Yourapp.view.YourDatePanel');
接下来获取itemTap上所选列表项的数据
var data = record.getData();
使用floatingDatePanel
方法
setData()
<强>更新强>,
查看您的面板代码后,我想您想将数据设置为面板中的第一项,即
{
styleHtmlCls:'homepage',
tpl:'<h4>{name3}</h4>'
}
对吗?如果是,那么您需要更改以下代码
floatingDatePanel.setData(data);
到
floatingDatePanel.getAt(0).setData(data);
因为,它是面板中第一个分配了模板的项目,并且希望在您想要设置数据的位置相同。
最后,您可以使用
将此面板添加到视口中Ext.Viewport.add(floatingDatePanel);