Hi everybody,
I'm trying to understand how model and context work for a SAPUI5 app. I'm using the MVC pattern.
This is an example:
I have a local model, json format, as follows:
{
"partners" : [
{
"name" : "Coca Cola",
"icon" : "/img/cocacola.png",
"people" : [
{
"name" : "Jonh",
"surname" : "Wayne",
"role" : "Developer"
},
{
"name" : "Matt",
"surname" : "Damon",
"role" : "Manager"
},
{
"name" : "Super",
"surname" : "Man",
"role" : "Hero"
},
... //other workers
]
},
... //other partners
]
}
So, in the local model I have n partners, every partner has his 1st level info (name, icon, etc) and a set of people that work for the partner.
I need to:
1 - create a SplitApp: on the main panel I want to display the list of partners.
2 - every time the user clicks on one of the partner (main panel, on the left), the main panel should show the list of "people" for the selected partner.
3 - every time the user clicks on one of the "people" working for the partner, the detail panel should show the details for that person.
As I said before, I'm working with the MVC pattern.
I've already implemented poit 1, it's working fine. What I don't understand is HOW can I pass the clicked item binding context to the second view, and use it to show the right set of people inside the new view..
this is how I set the "initial" model (as I said, point 1 is correctly working: I can show the partner list)
//--- This onInit is inside the homepage controller
onInit: function() {
var oModel = new sap.ui.model.json.JSONModel("model/data.json");
sap.ui.getCore().setModel(oModel);
},
now, this is the click handler for the partners list:
itemPress : function(e){
var bus = sap.ui.getCore().getEventBus();
bus.publish("nav", "to", {
id : "PartnerView",
data : {
context : e.getSource().getBindingContext()
}
});
}
bus.publish() is an event handler that at some point calls app.to(id, data); where id is the id of the page, and data is the context defined above.
Now I need to make point 2 work.. The press event is fired correctly, the page correctly changes showing the PartnerView, but the list inside the page is empty.. This is how I have created the list:
this.pplList = new sap.m.List("pplList", {
});
this.pplItemTemplate = new sap.m.StandardListItem({
title : "{name}"
});
this.pplList.bindAggregation("items", {
path : "/people", //--- if I put here /partners/5/people, it works but is not what I want..
template : this.pplItemTemplate
});
for now, it's ok to show only the name (I need to make it work first 
). On the PartnerView controller, I tried to add this code:
onInit : function() {
console.log("oninit");
// subscribe to onBeforeShow events
this.getView().addEventDelegate({
onBeforeShow : jQuery.proxy(function(evt) {
this.onBeforeShow(evt);
}, this)
})
},
onBeforeShow : function(evt) {
console.log("onbeforeshow");
if (evt.data.context) {
this.getView().setBindingContext(evt.data.context);
console.log(this.getView().getBindingContext()); //--- check the model, this is properly setted
}
}
but the list is not populated.. What am I doing wrong?
I understand that a view needs a model to display data, and if I'm not wrong the context is used by the view to understand "in what point of the model" it is.. but I dunno why it does not work..
Any help? thank you guys