Smith
Smith

Reputation: 119

How to get the value of a parameter from the url to pass on to the event handler

I have a business requirement where in i am developing a sapui5 employee leave application deployed in HCP using cloud based sap webide tool.

Two types of employees will access this application using two different url with parameters either 'IT' or 'BPO':

https://webidetesting453789-inf98834.dispatcher.int.sap.hana.ondemand.com/webapp/index.html#/IT

https://webidetesting453789-inf98834.dispatcher.int.sap.hana.ondemand.com/webapp/index.html#/BPO

Backend : I have developed a REST service which is giving me the employee details in jSON format when i do a GET request using the following url either for IT or BPO specific employees like: /irc.com/ircit/empleave/rest/empleave/item/requestor/IT or /irc.com/ircit/empleave/rest/empleave/item/requestor/BPO View: I have used a xml view MyRequest which will shows me requests from either IT or BPO in a tabular format.

And a Create view (XML view) with drop downs which is populated from a 'valueHelp' model and the page title etc changes based on the parameter which is either 'IT' or 'BPO'.

I have a create button in the footer of 'MyRequest' view which will call the Create view.

Requirement:

when i access the link https://webidetesting453789-inf98834.dispatcher.int.sap.hana.ondemand.com/webapp/index.html#/IT

I am getting all the requests for IT employees and same for BPO in the MyRequest view

But my requirement is in the same MyRequest view when i click the create button it should fetch the url parameter i.e either IT or BPO and navigate to the Create view with that url parameter so that i can set the valuehelp model and change the page title and name of ui components accordingly.

RouterConfiguration.

"routes": [{
                    "pattern": "",
                    "name": "myRequests",
                    "target": "myRequests"
                }, {
                    "pattern": "IT",
                    "name": "IT",
                    "target": "myRequests"
                }, {
                    "pattern": "BPO",
                    "name": "BPO",
                    "target": "myRequests"
                }, {
                    "pattern": "create",
                    "name": "Create",
                    "target": "create"
                }, 

                {
                    "pattern": "/id={id}",
                    "name": "Display",
                    "target": "display"
                }
            ],
            "targets": {
                "myRequests": {
                    "viewName": "MyRequests",
                    "viewId": "myRequests",
                    "viewLevel": 1
                },
                "display": {
                    "viewName": "Display",
                    "viewId": "display",
                    "viewLevel": 2
                },
                "create": {
                    "viewName": "Create",
                    "viewId": "create",
                    "viewLevel": 2
                },
                "copy": {
                    "viewName": "Create",
                    "viewId": "create",
                    "viewLevel": 2
                },
                "notFound": {
                    "viewName": "NotFound",
                    "viewId": "notFound"
                }
            }
        }
    },

MyRequest controller

onInit: function() {
        var oComponent = this.getOwnerComponent();
        this._router = oComponent.getRouter();
        this._router.getRoute("IT").attachPatternMatched(this._routePatternMatchedForIT, this);
        this._router.getRoute("BPO").attachPatternMatched(this._routePatternMatchedForBPO, this);

    },
    _routePatternMatchedForIT: function (oEvent) {
        console.log('Shout for IT');
        var sRouteName = oEvent.getParameter('name');
        // Call the service : /irc.com/ircit/empleave/rest/empleave/item/requestor/IT
    },
    _routePatternMatchedForBPO: function (oEvent) {
        console.log('Shout for BPO');
        // Call the service : /irc.com/ircit/empleave/rest/empleave/item/requestor/BPO
        var sRouteName = oEvent.getParameter('name');
    }

onCreatePress: function(oEvent) {
            //var sRouteName = this.getViewName();
            //alert(sRouteName);
            /*var sRouteName = oEvent.getParameter("name");
            if (sRouteName === "IT") {
                this.getRouter().navTo("create/IT");
            }
            if (sRouteName === "BPO"){

            this.getRouter().navTo("create/BPO");
            }*/
            this.getRouter().navTo("Create");
        },

MyRequest View for create button

Button id="btnCreate" text="{i18n>btnOpenCreateView}" press="onCreatePress" type="Accept" visible="true"/>

Create Controller

onRouteMatched: function(oEvent) {
            var sRouteName = oEvent.getParameter("name");
            //alert(sRouteName);
            if (sRouteName === "create") {
                this.routeName = sRouteName;
                this._loadDataDC();
            }

Please suggest me how to modify the create controller and MyRequest controller so that i get the value IT or BPO from the url

https://webidetesting453789-inf98834.dispatcher.int.sap.hana.ondemand.com/webapp/index.html#/IT

or

https://webidetesting453789-inf98834.dispatcher.int.sap.hana.ondemand.com/webapp/index.html#/BPO

and pass it on with the event onCreatePress() when create button is pressed so that i can navigate to the Create view and load the corresponding valueHelp model along with setting the page title and other ui components .

Upvotes: 4

Views: 15562

Answers (1)

Rahul Bhardwaj
Rahul Bhardwaj

Reputation: 2353

Use the below code to fetch the hash :

  1. Use HashChanger:

    var oHashChanger = new sap.ui.core.routing.HashChanger();
    var sHash = oHashChanger.getHash(); // it will return IT or BPO
    
  2. Use window object:

    var sHash = window.location.hash; // it will return #/IT or #/BPO.
    

Looking for better answers actually.

Upvotes: 4

Related Questions