SAPUI5 Custom Nav Router on Master Detail

Question

I am extending an existing FIORI application. The app is a master-detail app. I'm having problems on navigation to our custom details page. I am using SAP WEB IDE by the way.

Here is the piece of code I implemented on the controller of the master view. I can get Matnr with no problems.

  this.oRouter.navTo("newView",{
     Matnr :  i.getBindingContext().getProperty("Matnr")
  });

Here is a part of my component.js

this.cus.sd.salesorder.create.Component.extend("cus.sd.salesorder.create.SD_SO_CREExtension.Component", {
    metadata: {
        version: "1.0",

        routing: 
        {

            "routes" : {

                "newView": {
                "pattern": "newView/{Matnr}",
                 "view":"cus.sd.salesorder.create.SD_SO_CREExtension.view.CustomView",


                }

            },

         },

Here is my CustomView view

<mvc:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
    controllerName="cus.sd.salesorder.create.SD_SO_CREExtension.view.CustomView" xmlns:html="http://www.w3.org/1999/xhtml">
    <App>
        <pages>
            <Page title="Title">
                <content>
                    <Label text = "hello"></Label>
                </content>
            </Page>
        </pages>
    </App>
</mvc:View>

And here is the controller

    sap.ui.define([
        "sap/ui/core/mvc/Controller"
    ], function(Controller) {
        "use strict";

        return Controller.extend("cus.sd.salesorder.create.SD_SO_CREExtension.view.CustomView", {

                onInit: function() {
                    alert("hello");
                },
        });

});

Upon checking the URL it seems to be accessing it

....sap-ui-xx-componentPreload=off&origional-url=index.html&sap-ui-appCacheBuster=..%2F#&/newView/14

But I cannot see any label component.

Unknown Unknown · Accepted Answer · 2016-06-13T13:10:33

Since you're using the SAP WebIDE, you could consider using an extension project. Using an extension project avoids some manual coding. From the context menu of your original project, go to New > Extension Project. This will create a project that references the original project. You can then decide if you want to copy the original view and adjust it or create your own view from scratch. You can do this by going into your extension project > Tools > Extensibility Pane. In the pane, expand the view to be adapted/extended > right-mouse click > and you can copy and adapt, or write own view. You can find more in the help under Extending SAPUI5 Applications.

SAPUI5 Custom Nav Router on Master Detail

1 Answers