3

first at all, I´m aware that there were similiar asked questions, but none of the answers could solve my problem.

Short look into my code:

My Component.js looks like this

routes: [
            {
                pattern: "",                //home page
                name: util.Constants.Tile,
                view: util.Constants.Tile,
                viewId: util.Constants.Tile,
                targetAggregation: "pages"
                //targetControl: "idAppControl"
            },
            {
                pattern: "firstExample",
                name: util.Constants.FirstExample,
                view: util.Constants.FirstExample,
                viewId: util.Constants.FirstExample,
                targetAggregation: "pages",
                targetControl : "idAppControl",
                subroutes : [
                    {
                        pattern: "firstExample",
                        name: util.Constants.ExampleMaster,
                        view: util.Constants.ExampleMaster,
                        targetAggregation: "masterPages",
                        targetControl: "idSplitContainerControl",
                    },
                    {
                        pattern: "firstExample/:typeMaster:",
                        name: util.Constants.ExampleSecondMaster,
                        view: util.Constants.ExampleSecondMaster,
                        targetAggregation: "masterPages",
                        targetControl: "idSplitContainerControl",
                        subroutes : [
                            {
                                pattern : "firstExample/:typeDetail:",
                                name : util.Constants.ExampleDetail,
                                view : util.Constants.ExampleDetail,
                                targetAggregation : "detailPages"
                            }
                        ]
                    }
                ]
            },

Short explanation: It´s a page with a normal app view (no master view) and a following SplitContainer with two master and one detail view. Whenever I want to call the detail view 

onSelect : function (e) {
    var routeTo = e.getSource().getTitle();

    this.router.navTo(util.Constants.ExampleDetail, { typeDetail : routeTo } );

},

it says

2015-03-30 14:50:06 Control with ID idAppControl could not be found - sap-ui-core-dbg.js:15213

Any idea? Thanks for your help in advance!

Links to the similiar topics:

Community
  • 1
  • 1
Felix Bockemuehl
  • 147
  • 1
  • 3
  • 13
  • targetControl defines the control that will serve the views as aggregation of for example "content". which control should serve your views? take the id of this control and put it into targetControl: "id_of_your_control" – Manuel Richarz Mar 30 '15 at 16:03
  • Thanks for the answer. I have a SplitContainer (XML) with the ID 'idSplitContainerControl'. In the SplitApp mode this ID should serve my views. It works fine if I comment out the second subroutes with the detail view. I figured out that the DetailView (controller and view) isn´t even loaded even though it correctly routes to the right url. – Felix Bockemuehl Mar 30 '15 at 16:36
  • maybe because your subroute has the same pattern as the main route. i think with a normal router the second pattern will not match because of the greedy option. but i am not sure that this is the same case for subroutes. you can try it by enable the greedy option in your router. http://stackoverflow.com/questions/28948375/sapui5-routing-single-master-to-multiple-details – Manuel Richarz Mar 30 '15 at 17:15
  • Actually it´s not the same pattern, I add the name of the list element that is clicked after the "firstExample/". I tried the greedy option, what happened was that the router automatically jumped from the first to the second Master view, but still showed the same failure message as before. Thanks again for your help! :) – Felix Bockemuehl Mar 30 '15 at 17:36

1 Answers1

6

it's difficult to debug the routing code of someone else, so here is my working router for a multi page application. The first one is a simple page with tiles and the second one is a Master/Detail view.

routes : [
    {
        pattern : "",
        name: "launchpad",
        view: "Launchpad",
        targetControl: "masterView"
    },
    {
        pattern : "split",
        name: "app",
        view: "App",
        targetControl: "masterView",
        subroutes : [
            {
                pattern : "master",
                name : "main",
                // placed in master masterPages aggregation of splitapp
                view : "Master",
                targetAggregation : "masterPages",
                targetControl : "idAppControl",
                // places detail in detailPages aggreg. of the splitapp
                subroutes : [
                    {
                        // product context is expected
                        // and which tab should be selected (supplier/category)
                        pattern : "{product}/:tab:",
                        name : "product",
                        view : "Detail",
                        targetAggregation :  "detailPages"
                    }
                ]
            }
        ]
    },
    // catchall routes, to show not found message, when route is not valid
    {
        name : "catchallMaster",
        view : "Master",
        targetAggregation : "masterPages",
        targetControl : "idAppControl",
        subroutes : [
            {
                pattern : ":all*:",
                name : "catchallDetail",
                view : "NotFound"
            }
        ]
    }
]
}
// custom routing is performed in MyRouter.js
},

Note that the targetControl is set for both routes. masterView is part of the MasterApp that is loaded first.

<mvc:View
    xmlns:mvc="sap.ui.core.mvc"
    displayBlock="true"
    xmlns="sap.m">
    <App
        id="masterView">
    </App>
</mvc:View>

idAppControl is part of the App.view.xml with <SplitApp id="idAppControl" />. I based my application on the example in the developer guidelines just like you.

Component.js has this:

createContent: function() {
    var viewData = {
        component:this
    };
    return sap.ui.view({
        viewName: "sap.ui.demo.app.view.MasterApp",
        type: sap.ui.core.mvc.ViewType.XML,
        viewData: viewData
    });
}

App.view:

<mvc:View
    xmlns:mvc="sap.ui.core.mvc"
    displayBlock="true"
    xmlns="sap.m">
    <SplitApp id="idAppControl" />
</mvc:View>

Config:

routing: {
    config: {
        // custom router class
        routerClass : sap.ui.demo.app.MyRouter,
        // xml views
        viewType : "XML",
        // absolute path to views
        viewPath : "sap.ui.demo.app.view",
        // unless stated otherwise, router places view in detail part
        targetAggregation : "pages",
        // don't clear the detail pages before views are added
        clearTarget : false
    },
}

When looking at your router, I would say you have problems with the order of the pages. And as general advise, I would like to say that navTo takes the parameter "name" of the routes, not view or pattern. Took me some time to learn that.

Kind regards,

Michael

Michael K.
  • 535
  • 4
  • 21
  • Thanks for the answer and sorry for the late reply! Do I understand correctly that you use the normal "app view" (name: app) and set a SplitContainer on top of it? And how do you call the detail view in the second subroute? Because no matter how many master views I have, they all work fine, only the detail view in the subroute throws the error message. – Felix Bockemuehl Apr 01 '15 at 11:34
  • I deleted everything from the project that wasn´t necessary and tried to keep only the very basic stuff, maybe that makes it a bit easier to look over https://dl.dropboxusercontent.com/u/37336669/template%20new.zip It´s probably a very simple and stupid mistake I make but I honestly do not get what! – Felix Bockemuehl Apr 01 '15 at 12:01
  • You don't need the `rootView: "view.App"`` in the Component.js when you have a createContent function in there. In the config you use `targetAggregation : "detailPages"`, I added my config above. I have no idea what UI5 does with the targetAggregation, which is a pretty odd term in itself. But mine is always plural. detailPages, masterPages, pages. I can't get your app running, are you using Node or is it stand-alone for you? – Michael K. Apr 01 '15 at 13:55
  • Oh sorry, I didn´t include the sapui5 resource pack and just linked the sap-ui-core.js hosted on netweaver.ondemand, thought that would´ve been enough... anyway, I found my mistake. You were right with your config, I included a targetControl into it which caused the "control with ID idAppControl could not be found" error. A pretty stupid and avoidable mistake! Thanks a lot for your help! :) – Felix Bockemuehl Apr 01 '15 at 14:28
  • I uploaded it. You can find the files here https://github.com/michaelklopf/ui5_launchpad_prototype, but I didn't test it again, therefore I'm not sure it will work with current UI5 releases. – Michael K. Jul 30 '15 at 14:30