Passing Data from Master to Detail Page

Question

I watched some tutorials about navigation + passing data between views, but it doesn\'t work in my case. My goal is to achieve the follwing:

1. On the MainPage th

Answer 1

The recommended way to pass data between controllers is to use the EventBus

sap.ui.getCore().getEventBus();

You define a channel and event between the controllers. On your DetailController you subscribe to an event like this:

onInit : function() {
    var eventBus = sap.ui.getCore().getEventBus();
    // 1. ChannelName, 2. EventName, 3. Function to be executed, 4. Listener
    eventBus.subscribe("MainDetailChannel", "onNavigateEvent", this.onDataReceived, this);)
},

onDataReceived : function(channel, event, data) {
   // do something with the data (bind to model)
   console.log(JSON.stringify(data));
}

And on your MainController you publish the Event:

...
//Navigation to the Detail Form
app.to(page,"flip");
var eventBus = sap.ui.getCore().getEventBus();
// 1. ChannelName, 2. EventName, 3. the data
eventBus.publish("MainDetailChannel", "onNavigateEvent", { foo : "bar" });
...

See the documentation here: https://openui5.hana.ondemand.com/docs/api/symbols/sap.ui.core.EventBus.html#subscribe

And a more detailed example: http://scn.sap.com/community/developer-center/front-end/blog/2015/10/25/openui5-sapui5-communication-between-controllers--using-publish-and-subscribe-from-eventbus

Answer 2

You can also set local json model to store your data, and use it in the corresponding views. But be sure to initialize or clear it in the right time.

Answer 3

Even though this question is old, the scenario is still valid today (it's a typical master-detail / n-to-1 scenario). On the other hand, the currently accepted solution is not only outdated but also a result of an XY-problem.

is there a more elegant way?

Absolutely. Take a look at this example: https://embed.plnkr.co/F3t6gI8TPUZwCOnA?show=preview

No matter what control is used (App, SplitApp, or FlexibleColumnLayout), the concept is same:

1. User clicks on an item from the master.
   1. Get the binding context from the selected item by getBindingContext(/*modelName*/)
   2. Pass only key(s) to the navTo parameters (no need to pass the whole item context)
2. In Detail view
   1. Attach a handler to patternMatched event of the navigated route in onInit
   2. In the handler, create the corresponding key, by which the target entry can be uniquely identified, by accessing the event parameter arguments in which the passed key(s) are stored. In case of OData, use the API createKey.
   3. With the created key, call bindElement with the path to the unique entry in order to propagate its context to the detail view.
3. The relative binding paths in the detail view can be then resolved every time when the detail page is viewed (deep link support).