How to display a loading spinner on a Catalog Item and a Form and then clear the spinner once an outbound REST call returns

lsheets
Kilo Expert

I have a Record Producer which makes several outbound REST calls to pull in data from a 3rd party app.  I also have a form that is accessible to the users of the application which make the same REST calls to pull in data.    On two of the  calls I would like to display a  Spinner or a Please Wait  Dialog... to prevent the user from changing values in other fields on the item/form until the the fields are populated with the data returned by the API call.     This is for a scoped application so I can't use the synchronous XML call.  Does anyone have an example of how to do this from a catalog client script  or from a client script  or can someone point me to some documentation that would help me figure out how to do this ?  

2 REPLIES 2

Mohit Kaushik
Mega Sage
Mega Sage

Hi There,

Please have a look at below article, it should help you in achieving the same.

Adding a Loading Indicator to AJAX Catalog Forms

 

Please mark this answer as correct and helpful if it resolves the query and helpful alone if it lead you in right direction.

 

Thanks,

Mohit Kaushik

Thanks,
Mohit Kaushik
ServiceNow MVP (2023-2025)

Thanks for the info.  I  tried to build this out but can't get it to work. I don't really understand where the first part of the response should be created.  The problem may be that I am in a scoped app. 

I did some research over the past few days and found the following out on the SNguru site which I got to work today for the catalog item and the form 

       In the client script/catalog client script right before the getXML function call: 

         var gdw = new GlideDialogWindow('dialog_loading',true);
         gdw.setPreference('table', 'loading');
        gdw.setSize(300,200);
        gdw.render();

 

    at the end  of the getXML function call within the client script/catalog client script 

        // close the dialog window
        gdw.get().destroy();
        g form.hideFieldMsg('new_position_id');