CODEWITHSUNDEEP
sapui5
Matthijs Mennens
Matthijs Mennens

Reputation: 1145

Asynchronous function in SAPUI5

I'm using a function to open a dialog in SAPUI5. While this dialog is opening, some data should be set in the local storage of the browser. However, when I add the local storage function, it takes a few seconds to open the dialog.

Is there a way I can make the local storage async? I tried putting the function of the local storage after the opening of the dialog. But it doesn't change anything..

        /* WHEN THE USER CLICKS ON AN ASSIGNMENT IN THE CALENDAR */
        onClickAssignment: function(oEvent) {
            var oAppointment = oEvent.getParameter("appointment");
            this.lastAppointment = oAppointment;

            if (oAppointment) {
                var key = this.byId("PC1").getViewKey();

                if (key === "Month") {
                    if (!this._oDetailsDialog || this._oDetailsDialog === null) {
                        // show assignment dialog
                        this._oDetailsDialog = sap.ui.xmlfragment(this.fragmentDetailsId, "be.xxxxxxxxxxx.fragment.viewAssignment", this);
                        this.getView().addDependent(this._oDetailsDialog);
                    }
                } else {
                    if (!this._oDetailsDialog || this._oDetailsDialog === null) {
                        // show subassignment dialog
                        this._oDetailsDialog = sap.ui.xmlfragment(this.fragmentDetailsId, "be.xxxxxxxxxxx.fragment.viewSubassignment", this);
                        this.getView().addDependent(this._oDetailsDialog);
                    }
                }


                this.oAppBC = oAppointment.getBindingContext();
                this._oDetailsDialog.setBindingContext(this.oAppBC);
                this._oDetailsDialog.open();
                this.lastClickedAssignment = oAppointment.getProperty("assignment");
                this.lastClickedSubassignment = oAppointment.getProperty("subassignment");

                //SET LOCAL STORAGE
                //  var stringifiedContext = CircularJSON.stringify(oAppointment.getBindingContext());
                //  var stringifiedAssignment = CircularJSON.stringify(oAppointment.getProperty("assignment"));
                //  var stringifiedSubassignment = CircularJSON.stringify(oAppointment.getProperty("subassignment"));

                //  this.setLocalStorage("context", stringifiedContext);
                //  this.setLocalStorage("assignment", stringifiedAssignment);
                //  this.setLocalStorage("subassignment", stringifiedSubassignment);
            }
        },

Upvotes: 1

Views: 1955

Answers (1)

Skay
Skay

Reputation: 9493

You can detach execution of that part of the code from the main execution thread by wrapping it into setTimeout:

/* WHEN THE USER CLICKS ON AN ASSIGNMENT IN THE CALENDAR */
onClickAssignment: function(oEvent) {
    var oAppointment = oEvent.getParameter("appointment");
    this.lastAppointment = oAppointment;

    if (oAppointment) {
        var key = this.byId("PC1").getViewKey();

        if (key === "Month") {
            if (!this._oDetailsDialog || this._oDetailsDialog === null) {
                // show assignment dialog
                this._oDetailsDialog = sap.ui.xmlfragment(this.fragmentDetailsId, "be.xxxxxxxxxxx.fragment.viewAssignment", this);
                this.getView().addDependent(this._oDetailsDialog);
            }
        } else {
            if (!this._oDetailsDialog || this._oDetailsDialog === null) {
                // show subassignment dialog
                this._oDetailsDialog = sap.ui.xmlfragment(this.fragmentDetailsId, "be.xxxxxxxxxxx.fragment.viewSubassignment", this);
                this.getView().addDependent(this._oDetailsDialog);
            }
        }


        this.oAppBC = oAppointment.getBindingContext();
        this._oDetailsDialog.setBindingContext(this.oAppBC);
        this._oDetailsDialog.open();
        this.lastClickedAssignment = oAppointment.getProperty("assignment");
        this.lastClickedSubassignment = oAppointment.getProperty("subassignment");

        setTimeout(function () {
             //SET LOCAL STORAGE
             var stringifiedContext = CircularJSON.stringify(oAppointment.getBindingContext());
             var stringifiedAssignment = CircularJSON.stringify(oAppointment.getProperty("assignment"));
             var stringifiedSubassignment = CircularJSON.stringify(oAppointment.getProperty("subassignment"));

             this.setLocalStorage("context", stringifiedContext);
             this.setLocalStorage("assignment", stringifiedAssignment);
             this.setLocalStorage("subassignment", stringifiedSubassignment);
        });
    }
},

OR you can also do it after open:

this._oDetailsDialog.attachEventOnce('afterOpen', function () {
     //SET LOCAL STORAGE
     // ...
});

Upvotes: 2

Related Questions