現在、SenchaTouch1を使用してアプリケーションに取り組んでいます。TabPanelに2つのアイテムがあります。検索とアラーム。
クリックすると[検索]タブに4つのリストが表示されます。ユーザーがリストの4番目の項目をクリックすると、タブを手動でクリックしなくても、自動的に[アラーム]タブに移動します。
そのために使用できる関数はありますか?
Senchatouchの初心者です。提案は大歓迎です。
これは私のapp.jsです
ToolbarDemo=new Ext.Application({
name:'ToolbarDemo',
launch:function(){
ToolbarDemo.views.Viewport=new Ext.TabPanel({
fullscreen:true,
defaults:
{
html:'',
styleHtmlContent:true,
} ,
tabBar:
{
dock:'bottom',
layout:{
pack:'center'
}
},
items:[
/*
{
xtype:'homecard'
},
*/
{
xtype:'searchcard'
},
/*
{
xtype:'actioncard'
},
*/ {
xtype:'settingscard'
},
{
xtype:'morecard'
},
] ,
});
}
});
そしてsearchcardには次のコードがあります(searchcard.js)
Ext.regModel('Contact',{
fields:['firstName','lastName']
});
//create a store
var liststore = new Ext.data.Store({
model:'Contact',
getGroupString:function(record){
return record.get('firstName')[0];
},
data:[
{firstName:'Network Summary'},
{firstName: 'Alarms and Alerts'},
]
});
detailpanel=new Ext.Panel({
layout:'fit',
id:'detailpanel',
html:'HELLO ',
});
listpanel =new Ext.List({
id:'indexlist',
store:liststore, //take data from store created above
itemTpl:'{firstName}',
indexBar:true , //property of list
onItemDisclosure:function(record)
{
mainpanel.setActiveItem('detailpanel');
}
});
mainpanel=new Ext.Panel({
id:'mainpanel',
layout:'card',
items:[
listpanel,detailpanel
],
});
ToolbarDemo.views.Searchcard= Ext.extend(Ext.Panel,{
title:'Search',
iconCls:'search',
badgeText:'1',
layout:'fit',
//items:[listpanel],
initComponent: function() {
Ext.apply(this, {
items:[mainpanel],
});
ToolbarDemo.views.Searchcard.superclass.initComponent.apply(this, arguments);
}
}) ;
Ext.reg('searchcard',ToolbarDemo.views.Searchcard);
そして、私のアラームタブには次のコードがあります(morecard.js)
Ext.regModel('Contact',{
fields:['firstName','lastName']
});
var liststore = new Ext.data.Store({
model:'Contact',
getGroupString:function(record){
return record.get('firstName')[0];
},
data:[
{firstName:'Critical Alarms'},
{firstName: 'Major alarms'},
{firstName: 'Minor alarms'},
{firstName: 'Alerts'},
]
});
detailpanel=new Ext.Panel({
id:'detailpanel',
tpl:'HELLO ',
});
listpanel_my =new Ext.List({
id:'indexlist',
store:liststore, //take data from store created above
itemTpl:'{firstName}',
indexBar:true , //property of list
onItemDisclosure:function(record)
{
// ToolbarDemo.views.Viewport.setActiveItem('detailpanel');
}
});
ToolbarDemo.views.Morecard = Ext.extend(Ext.Panel, {
title: "Alarms",
iconCls: "more",
cardSwitchAnimation: 'slide',
initComponent: function() {
Ext.apply(this, {
items:[listpanel_my] ,
});
ToolbarDemo.views.Morecard.superclass.initComponent.apply(this, arguments);
}
});
Ext.reg('morecard', ToolbarDemo.views.Morecard);
特に、[検索]タブ(searchard.js)で[アラームとアラート]という名前のリストアイテムをクリックすると、[アラーム]タブが自動的にアクティブになり、そのアイテム(メジャーアラーム、マイナーアラームなど)が表示されます。