How to pass a string to controller method from html view in SAPUI5?

Question

I need to build a navigation with a dynamic route parameter from controller.

//user.controller.js

(function () {
  sap.ui.controller("app.User", {
    getNavUrl: function (tab) {
      return '#/users/+ this.userId + '/' + tab;
    }
  });
}());

//user.view.html
<div data-sap-ui-type="ui5strap.Nav" data-selection-mode="Single">
  <div data-sap-ui-type="ui5strap.ListNavItem" 
       data-selected="true"
       data-text="{i18n>Grants}" 
       data-href={getNavUrl('grants')}> <!-- cant make this to work! -->
  </div>

  <div data-sap-ui-type="ui5strap.ListNavItem"
       data-text="{i18n>Opportunities}" 
       data-href={getNavUrl('opportunities')}> <!-- cant make this to work! -->
  </div>

</div>

So, the way i'd do this in any MVC - is by passing a string to controller method from within view, but i can't seem to find a way to invoke controller method from view in sapui5.

`sap.ui.core.mvc.HTMLView` is deprecated as of UI5 1.108. For other cases (e.g. in `XMLView`), see https://stackoverflow.com/a/53609552/5846045 — Boghyon Hoffmann, Feb 28 '23 at 10:22

score 0 · Answer 1 · answered May 20 '15 at 15:38

0

You can invoke a method like this:

sap.ui.getCore().byId("idofviewhere").oController.onBeforeRendering();

In your case:

sap.ui.getCore().byId("idofviewhere").oController.getNavUrl(tab);

answered May 20 '15 at 15:38

brso05

13,142
2
21
40

where should I call that? – Dziamid May 20 '15 at 15:50
@Dziamid sorry it might only be applicable for a `js.view`...Have you thought about changing from `html.view` to `js.view`? I think you have the most control with `js.view`... – brso05 May 20 '15 at 15:53
no, this is not an option. is there any other way to do it with html view? – Dziamid May 20 '15 at 15:56
@Dziamid in your `getNavUrl` method can you directly check to see what "tab" the user is on for example `sap.ui.getCore().byId("tabs").selectedTab()` this is just an example I don't know exactly what the call would look like... – brso05 May 20 '15 at 15:58
i don't think it would solve my problem. maybe i can pass userId to the view, how can i build a url then? e.g. would that work: `data-href="{'#users' + userId + "/grants"}"` ? – Dziamid May 20 '15 at 16:05

score 0 · Answer 2 · answered Sep 13 '16 at 08:21

Did you try using SAPUI5's internal function handlers? Here is an example with a button press:

//user.controller.js

 (function () {
      sap.ui.controller("app.User", {


        navigateFoo: function (oEvent) {
             alert("you are now navigating. If you want to dynamically alter your destination, 
                    consider putting custom data into your UI object, and using 'oEvent.getSource()'
                    in the controller to get access to your UI object, and all custom data inside");
            }
      });
    }());

//user.view.html

<div data-sap-ui-type="sap.ui.commons.Button" id="myButton" data-text="Navigate" data-press="navigateFoo"></div>

In your case, you could check if your listnav items have a 'data-press' or equivalent you can use.

How to pass a string to controller method from html view in SAPUI5?

2 Answers2