0

I have a View "DescriptionWithBooking" and am trying to open another View ("EmailTicket") when the submit button is clicked on a Dialog which is in "DescriptionWithBooking" View. But it shows the error:

Cannot read property 'getTargets' of undefined.

DescriptionWithBooking.controller.js

sap.ui.define([
  'sap/m/Button',
  'sap/m/Dialog',
  'jquery.sap.global',
  'sap/m/Label',
  'sap/ui/layout/HorizontalLayout',
  'sap/ui/layout/VerticalLayout',
  'sap/m/Text',
  'sap/m/TextArea',
  'sap/m/MessageToast',
  'sap/ui/core/Fragment',
  'sap/ui/core/mvc/Controller',
  'sap/ui/model/Filter',
  'sap/ui/model/json/JSONModel',
  "sap/ui/core/routing/History"
], function(Button, Dialog, jQuery, Label, HorizontalLayout, VerticalLayout, Text, TextArea, MessageToast, Fragment, Controller, Filter, JSONModel, History) {
  "use strict";

  var CController = Controller.extend("Movie.controller.DescriptionWithBooking", {

    onInit: function() {
      // set explored app's demo model on this sample
      var oModel = new JSONModel(jQuery.sap.getModulePath("sap.ui.demo.mock", "/products.json"));
      this.getView().setModel(oModel);
    },

    onExit: function() {
      if (this._oDialog) {
        this._oDialog.destroy();
      }
    },

    getRouter: function() {
      return sap.ui.core.UIComponent.getRouterFor(this);
    },

    handleSelectDialogPress: function(oEvent) {
      if (!this._oDialog) {
        this._oDialog = sap.ui.xmlfragment("Movie.view.Dialog", this);
        this._oDialog.setModel(this.getView().getModel());
      }
      // Multi-select if required
      var bMultiSelect = !!oEvent.getSource().data("multi");
      this._oDialog.setMultiSelect(bMultiSelect);
      // Remember selections if required
      var bRemember = !!oEvent.getSource().data("remember");
      this._oDialog.setRememberSelections(bRemember);
      // clear the old search filter
      this._oDialog.getBinding("items").filter([]);
      // toggle compact style
      jQuery.sap.syncStyleClass("sapUiSizeCompact", this.getView(), this._oDialog);
      this._oDialog.open();
    },

    handleSearch: function(oEvent) {
      var sValue = oEvent.getParameter("value");
      var oFilter = new Filter("Name", sap.ui.model.FilterOperator.Contains, sValue);
      var oBinding = oEvent.getSource().getBinding("items");
      oBinding.filter([oFilter]);
    },

    handleClose: function() {
      var dialog = new Dialog({
        title: 'Confirm',
        type: 'Message',
        content: [
          new Label({
            text: 'Want to add more other people else continue ?',
            labelFor: 'submitDialogTextarea'
          }),
          new sap.ui.commons.TextArea('submitDialogTextarea', {
            liveChange: function(oEvent) {
              var sText = oEvent.getParameter('value');
              var parent = oEvent.getSource().getParent();
              parent.getBeginButton().setEnabled(sText.length > 0);
            },
            width: '100%',
            height: '100%',
            placeholder: 'Any other person for movie. ex: Swapnil Garg : Friend'
          })
        ],
        beginButton: new Button({
          text: 'Submit',
          enabled: true,
          press: function() {
            //Here I am calling the view
            var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
            oRouter.getTargets().display("email", {
              fromTarget: "book"
            });
            dialog.close();
          }
        }),
        endButton: new Button({
          text: 'Cancel',
          press: function() {
            dialog.close();
          }
        }),
        afterClose: function() {
          dialog.destroy();
        }
      });
      dialog.open();
    },

    onBack: function() {
      var oHistory, sPreviousHash;
      oHistory = History.getInstance();
      sPreviousHash = oHistory.getPreviousHash();
      if (sPreviousHash !== undefined) {
        window.history.go(-1);
      } else {
        this.getRouter().getTargets().display("home", {
          fromTarget: "book"
        });
      }
    }
  });

  return CController;
});

manifest.json:

"routes": [{
  "name": "apphome",
  "target": "home"
}, {
  "name": "bookmovie",
  "target": "book"
}, {
  "name": "emailticket",
  "target":"email"
}],
"targets": {
  "home": {
    "viewName": "View1",
    "viewLevel" : 1
  },
  "book": {
    "viewPath": "Movie.view",
    "viewName": "DescriptionWithBooking",
    "viewLevel": 2
  },
  "email": {
    "viewPath": "Movie.view",
    "viewName": "EmailTicket",
    "viewLevel": 3
  }
}
Boghyon Hoffmann
  • 17,103
  • 12
  • 72
  • 170
Swappy
  • 160
  • 1
  • 7
  • 29
  • Does this answer your question? [How to access the correct \`this\` inside a callback?](https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback) – Boghyon Hoffmann Jul 13 '21 at 15:01
  • Related: https://stackoverflow.com/a/62120803/5846045. Neither `bind` nor an anonymous function should be used when attaching a handler. Otherwise, the handler is not detachable! – Boghyon Hoffmann Jul 13 '21 at 15:05

2 Answers2

0

In your handleClose I think you should get the router (like you have)

var oRouter = this.getOwnerComponent().getRouter();

and then navigate to (documentation link) the relevant view 

oRouter.navTo("home", {}, true);    // set args as appropriate

I am not sure about your usage for getRouter().getTargets()

Bernard
  • 1,208
  • 8
  • 15
  • It now displays Uncaught TypeError: Cannot read property 'navTo' of undefined – Swappy Oct 23 '17 at 10:23
  • You are not retrieving your router correctly. You have a method called getRouter() which you are not using. Which approach are you using to get the router in your code currently? Look at the api for UIComponent -> https://sapui5.hana.ondemand.com/#/api/sap.ui.core.UIComponent (there is not method getRouterFor). There is a getRouter() method. Make sure you are getting a handle (reference) to the router correctly. – Bernard Oct 23 '17 at 10:53
  • It says this.getRouter is not a function – Swappy Oct 23 '17 at 11:12
  • have you tried this: this.getOwnerComponent().getRouter() – Bernard Oct 23 '17 at 11:37
  • yeah it says this.getOwnerComponent is not a function – Swappy Oct 23 '17 at 11:47
  • I am not sure where you are using this code ('this' can change as context changes) – Bernard Oct 23 '17 at 12:14
  • inside beginbutton – Swappy Oct 23 '17 at 12:17
0

inside submit function this have function scope.

**//Here I am calling the view
            var oRouter =  sap.ui.core.UIComponent.getRouterFor(this);

instead copy this reference to a variable inside controller's handleClose function like

var that = this;

then use 

**//Here I am calling the view
            var oRouter =  sap.ui.core.UIComponent.getRouterFor(that);
techippo.com
  • 245
  • 1
  • 4