SAP Fiori: Back button in fragments

0
votes

I am working on a SAP Fiori app and I am stuck in this problem for about 2 weeks with no result. I have a "create" fragment which is attached to "Detail" view.

When I open the "create" fragment and want to go back to the main detail view, the back button doesn't work therefore I have to refresh the app.

I guess the back button doesn't work the same way between views & between fragments.

Here's my back button function : 

cancel: function() {

        var oHistory = sap.ui.core.routing.History.getInstance(),
            sPreviousHash = oHistory.getPreviousHash();

        if (sPreviousHash !== undefined) {
            // The history contains a previous entry
            history.go(-1);
        }

    },

Here when I display sPreviousHash, it's undefined. Why?

2
sapui5sap-fiori

2 Answers

0
votes

Where is the back button that you are referring to?

I would expect that the fragment is a dialog and therefore that there is no back button. A close button is needed which will result in the fragment being closed. Depending on the requirements, the back navigation could then be done from the controller where the fragment was created.

Fragments are a technique to reuse UI parts, but are not part of the MVC concept. You cannot navigate directly to/from a fragement and this has to be done using views. Therefore the history is not available in a fragment. The BROWSER back button will take you to the previous screen in the BROWSER history.

0
votes

Controller of the view in which the fragment as a dialog is opened.

    _initializeReviewDialog: function() {   this._oReviewDialog = sap.ui.xmlfragment(this.getView().getId(), "ReviewDialog", this);

    this.attachControl(this._oReviewDialog);

    },

Event in View that triggers the dialog opening

onEditReviewPressed: function(oEvent) {


    if (!this._oReviewDialog) {

        this._initializeReviewDialog();     }


        }

    this._oReviewDialog.open();

    },



    onReviewDialogOKPressed: function(oEvent) {

        this._oReviewDialog.close();

    },

Add fragment as a Dependent, so that models and events from owning view/controller are know

attachControl: function(oControl) {

    var sCompactCozyClass = this.getOwnerComponent().getContentDensityClass();

    jQuery.sap.syncStyleClass(sCompactCozyClass, this.getView(), oControl);

    this.getView().addDependent(oControl);

    },

FragmentDefinition

    <core:FragmentDefinition id="ReviewDialogFragment" xmlns="sap.m" xmlns:l="sap.ui.layout"

        xmlns:core="sap.ui.core">

    <Dialog id="reviewDialog" >

        <content>

            ...         </content>

        <beginButton>

            <Button id="btnOK" text="{i18n>xbut.ok}" press="onReviewDialogOKPressed"/>

        </beginButton>  </Dialog>


</core:FragmentDefinition>