Busy Indicator is not working with OData Model

[Former Member]

Hi All,

I am trying to make OData read call to get the data and I want to display a busy indicator until I get the data from backend.

To do this , I have used attachRequestSent and completed method and inside those I have used .show() and .hide() method. But these methods and never getting executed,

This is the order I have used:

1.                var oModelData;
2.             var oDataModelSearch = new sap.ui.model.odata.ODataModel("..<service     name>..",false);
3.             sap.ui.getCore().setModel(oDataModelSearch, "OModelSearch");
4.             sap.ui.getCore().getModel("OModelSearch").attachRequestSent(function(){
5.              sap.ui.core.BusyIndicator.show(10);
6.        });
7.             oDataModelSearch.read("/Entity",null,null,false,
8.             function fnSuccess(oData){
9.                 this.data= oData.results;
10.                 oModelData= oData.results;
11.             },
12.             function fnError(response){ });
13.             sap.ui.getCore().getModel("OModelSearch").attachRequestCompleted(function(){
14.                 sap.ui.core.BusyIndicator.hide();
15.             });
16.             return oModelData;

Is there somthing I am missing, or the order should  be something else.

PS: When I run this in debug mode, after going to line 4 its directly jumping to Line 7 skipping line 5.

Thanks in Advance!

Regards,

Anupriya

[former_member182372 · Accepted solution]

make it async

oDataModelSearch.read("/Entity",null,null,true,

[Former Member · Accepted solution]

Hi Maksim,

Thanks for the reply. I have tried with async-true but its still not working. Also, its failing to get  the data if I keep async parameter as true.

Is there any other way around?

Regards,

Anupriya

[former_member182372 · Accepted solution]

1. sap.ui.core.BusyIndicator.show(10);
2. try{
3. oDataModelSearch.read("/Entity",{
4.             success : function (oData) {
5.                 this.data= oData.results;
6.                 oModelData= oData.results;
7.                 sap.ui.core.BusyIndicator.hide();
8.             },
9.             error : function (response) {
10.                 sap.ui.core.BusyIndicator.hide();
11.             } );
12. }
13. catch(err)
14. {
15. sap.ui.core.BusyIndicator.hide();
16. }

[Former Member · Accepted solution]

Hi Maksim,

I have tried the following approach and If I don't call hide() method then I am able to see the busy indicator, but in that case it will be keep on showing even after I get the data.

But If I use hide() method, then I am not able to see the indicator.

Regards,

Anupriya

[Former Member · Accepted solution]

Maksims code should work if you specify the request as async : true.

[former_member182372 · Accepted solution]

async default value is true, so no need to pass it

		// bAsync default is true ?!
		bAsync = bAsync !== false;

[Former Member · Accepted solution]

Aaaaah I am sorry, that was my mistake. I wanted to say false, so you request is not asyncron but I somehow mixed that up.

[Former Member]

Create a folder - util under Webcontent and create a file busyUtil.js inside util folder

Write the below code in busyUtil.js

_busyIndicator : null,

    setBusyOn : function() {

      if (!this._busyIndicator) {

        this._busyIndicator = new sap.m.BusyDialog();

      }

      this._busyIndicator.open();

    },

    setBusyOff : function() {

      this._busyIndicator.close();

    },

---------------------------------------------------

call busy on before reading the data from backend.

util.busyUtil.setBusyOn();

------------------------------------------------------------

Set the busy off in success or failure function.

util.busyUtil.setBusyOff();

[Former Member]

Hi, how is this code sopposed to work? if I just insert the code as you said then i get too many errors. is the busyUtil.js a controller or a view or how should i encapsulate the code you provided?

I am developing in WebIDE for clarification.

[Former Member]

Hi German,

I have used it the following way and its working for me.

$.sap.declare("HR.util.Busy");

HR.util.Busy = {

    _busyIndicator : null,

    setBusyOn : function(opacity) {

      if (!this._busyIndicator) {

        this._busyIndicator = new sap.m.BusyDialog();

      }

      this._busyIndicator.open();

      if(opacity===undefined) opacity=0;

      else opacity=0.3;

      $(".sapUiBLy").css('opacity',opacity);

    },

    setBusyOff : function() {

      this._busyIndicator.close();

    },

};

And I am calling this util file using HR.util.Busy.setBusyOn() and HR.util.Busy.setBusyOff() from my controller files.

Hope it helps!.

Regards,

Anupriya

[Former Member]

Thanks, this really helped!

[Former Member]

just for clarification: is HR a folder and util is a folder inside HR and the file Busy.js? And i dont need to create a variable like var smth = new HR.util.Busy() in order to run method setBusyOff()?

Thanks in advance!

[Former Member]

Yeah that is the path of the file where I have kept it.

You can modify it accordingly. You can directly specify the name of the file and the method name if they have the same root folder.

Regards,

Anupriya

[sanchal]

Hi Anupriya,

try below:

Define busy indicator-

var busyDialog = (busyDialog) ? busyDialog

         : new sap.m.BusyDialog({})

       var busyCSS = new sap.m.BusyIndicator({

        size : '30px'

       });

when you want to show busy indicator use-

busyDialog.open();

after reading data use-

busyDialog.close();

Regards,

Bhagyashree.

[Former Member]

Hi Bhagyashree,

I tried as you said and I could see the result in debug mode. Do we have some parameter for open() method to pass the duration for which the indicator should be shown.

As in my case I am getting the data very faster and system doesn't get the chance to show the indicator.So can we explicitly define the duration of the indicator.

Thanks!

Anupriya

[sanchal]

Hi Anupriya,

There is no parameter as such for open or close method, but you close indicator in settimeout() by passing required time.

setTimeout(function() {

  busyDialog.close();

  }, 100);

Hope this answers your query.

Regards,

Bhagyashree.

[naveenraj_a]

Hi Anu, Try the below approach.

var dialog = new sap.m.BusyDialog({

  text:'Loading Data...'

});

dialog.open();

  oDataModelSearch.read(url, null, null, true, function(oData,oResponse) {

  this.data= oData.results;

        oModelData= oData.results;

        dialog.close();

},

function(errorResponse) {

dialog.close();

console.log(errorResponse);

});

Thanks.

[Former Member]

Hi Naveen,

I have already tried this. The problem is I am not getting the data if I keep async- true in odata read call, on the other hand I am able to get the data when I keep async- false.

So the approach you mentioned should work fine if I keep async-false?

And I want to use Busy indicator instead of Busy dialog.

Thanks!

Regards,

Anupriya

[former_member194957]

Hi Anupriya,

     Sometimes the busy indicator doesnot show up properly it would be hidden behind the current window. Try adjusting the position of the standard control for busy indicator to showup.

#busyIndicator {

                display: none;

                position: fixed;

                z-index: 999;

                background: rgba(0,0,0,0.25);

                width: 100%;

                height: 100%;

            }

            #busyIndicator > div:first-child {

                position: relative;

                top: 38%;

                left: calc(50% - 3rem);

            }

assign this css class to your control.

first check if the busy indicator is shown properly on the current screen...

Hope this helps.

Thanks,

Tharun.

[santhu_gowdaz]

try like this,

1.    oDataModelSearch.attachRequestSent(function(){
2.              sap.ui.core.BusyIndicator.show(10);
3.        });
5. oDataModelSearch.attachRequestCompleted(function(){
6.                 sap.ui.core.BusyIndicator.hide();
7.             });

[Former Member]

Hi Santosh,

I have tried this but still not able to see. The problem which is happening is it goes to attachRequest method and then jumps to OData.read call and get the data. show() is never getting executed.

Thanks!

Regards,

Anu

[Private_Member_15166]

Hi Anu,

See this link.