Sencha Touch 2 - Creating a list with static views - extjs

Question

I've followed the documentation provided by Sencha and made myself a list of items, converted it to a navigationview and a following details page. This is a many-to-1 solution and described with the picture below:
With this solution I can send the title of the item in the list into the detailsview, and type something like this:
[code]`
Ext.define('navigation.view.PresidentDetails', {
extend: 'Ext.Panel',
xtype: 'presidentdetail',
config: {
styleHtmlContent: true,
scrollabe: 'vertical',
title: 'Details',
tpl: 'Hello {firstName}!'
}
});
`[/code]
It seems I cant use statements in this code so I can specify what content I want depending on what item I clicked on. So then my question is - how do I create a more static perspective into this? Can I create a 1-to-1 relationship instead? (See image below)
Anyone knows how to achieve this? I'm currently using MVC and this is the current state of "my" (read: Senchas) controller just to get a hang of it:
Ext.define('navigation.controller.Main', {
extend: 'Ext.app.Controller',
config: {
refs: {
main: 'mainpanel'
},
control: {
'presidentlist': {
disclose: 'showDetails'
}
}
},
showDetails: function(list, record) {
this.getMain().push({
xtype: 'presidentdetail',
data: record.data
});
}
});

Answer 1

This problem is now solved, and it was alot easier than I thought it would be. I looked up the itemTap event in the docs and used the index of the item as an ID and wrote this little snippet.
showDetailsonItemTap: function(list, index, target, record) {
var page;
switch(index) {
case 0:
page = 'presidentdetail';
break;
case 1:
page = 'presidentdetail2';
break;
}
this.getMain().push({
xtype: page,
data: record.data
});
console.log(index);
}
After that, its just creating views manually and hit their xtype within the switchstatement.