Pass and show data from ListView to TabView Sencha Touch - extjs

Question

I have ListView with user list. My controller have event listener on user tap which opens new view (TabView), where I want to show detailed information about user in TabView container template, but it doesn't displays anything.
Controller:
Ext.define('HockeyTeamManagementSystem.controller.Users', {
extend: 'Ext.app.Controller',
config: {
refs: {
UserList: 'userlist',
Users: 'users',
UserDetails: 'userdetailtabs'
},
control: {
"#UserList": {
itemtap: 'onListItemTap'
},
"tabpanel": {
initialize: 'onTabpanelInitialize'
}
}
},
onListItemTap: function(dataview, index, target, record, e, eOpts) {
var user = Ext.create("HockeyTeamManagementSystem.view.UserDetailTabs", {
title: record.data.name +" "+ record.data.lastname,
record: record
});
this.getUsers().push(user).setData(record.data);
},
TabView:
Ext.define('HockeyTeamManagementSystem.view.UserDetailTabs', {
extend: 'Ext.tab.Panel',
alias: 'widget.userdetailtabs',
requires: [
'Ext.tab.Bar',
'Ext.XTemplate'
],
config: {
activeItem: 1,
defaults: {
styleHtmlContent: false
},
tabBar: {
docked: 'bottom',
layout: {
type: 'hbox',
pack: 'center'
}
},
items: [
{
xtype: 'container',
title: 'Information',
iconCls: 'info',
tpl: [
'name: {name}'
]
},
{
xtype: 'container',
title: 'Statistics',
iconCls: 'star'
},
{
xtype: 'container',
title: 'Payments',
iconCls: 'compose'
}
]
}
});

Answer 1

You need to set the data in the container and not in the view itself.
{
xtype: 'container',
title: 'Information',
iconCls: 'info',
name: "info",
tpl: [
'name: {name}'
]
}
In the controller:-
refs: {
infoContainer: 'container[name="info"]'
}
Now set the data:-
onListItemTap: function(dataview, index, target, record, e, eOpts) {
var user = Ext.create("HockeyTeamManagementSystem.view.UserDetailTabs", {
title: record.data.name +" "+ record.data.lastname,
record: record
});
this.getUsers().push(user);
this.getInfoContainer().setData(record.data);
}

Answer 2

Well, after some hours of testing different things I realized that I simply need to set data from onListItemTap function to TabView items:
refs: {
UserInformationTab: '#UserInformationTab'
},
onListItemTap: function(dataview, index, target, record, e, eOpts) {
var user = Ext.create("HockeyTeamManagementSystem.view.UserDetailTabs", {
title: record.data.name +" "+ record.data.lastname,
record: record
});
this.getUsers().push(user);
this.getUserInformationTab().setData(record.data);
}