How to show loader in existing pop up after clicking ok button

akshayp
Tera Expert

Hello, anyone with any idea on this, please revert ASAP

 

I have ui action on table, and if  i click it , it displays one pop up with comment box and Cancel, Ok buttons.

Now, if user fills comments and click 'ok', it takes some time to update record.

For that time, i want to show loader in existing pop up.

i tried enhancing my ui page (client script of ui page at line 13), but i was only able to place one loading pop up over my existing pop up

  Anyone, who has idea on this please share some code or links, Thanks!!

 

Note- by loader i mean exactly like this----

Screenshot 2023-03-20 at 10.57.46 AM.png

 

Screenshot 2023-03-20 at 10.46.07 AM.png

 

Screenshot 2023-03-20 at 10.47.36 AM.png

 

Ui action (client side)--

 

Screenshot 2023-03-20 at 10.49.51 AM.png

 

UI page----

 

HTML---

Screenshot 2023-03-20 at 10.52.31 AM.png

 

Client script--

Screenshot 2023-03-20 at 10.53.59 AM.png

 

processing script--

Screenshot 2023-03-20 at 10.56.05 AM.png

1 ACCEPTED SOLUTION

Prince Arora
Tera Sage
Tera Sage

@akshayp ,

 

If you want to use the same modal just to render the separate content here is the example, I believe in your use case you just want to show the loader to the user for a good UI point of view, please check below case:

 

var mod = new GlideModal().get('sn_vdr_something........'); // Please provide the name of first GlideModal parameter 
mod.renderWithContent('<div><img src="https://media0.giphy.com/media/v1.Y2lkPTc5MGI3NjExZmRkZDExYWRhODFjYWVjOGNjYzhmMDgwODRlNDBjN2Q0MGQ4ZTcyMyZjdD1n/3oEjI6SIIHBdRxXI40/giphy.gif"></img></div>')

By this manner, you can use the same GlideModal for your different content.

if you want to destroy the previous modal, you can use:

 

var mod = new GlideModal().get('sn_vdr_something........');

mod.destroy();
 

After destroying it, attach a new one by creating a new GlideModal object, but if your use case is specific to the loader, you can use the first suggestion and provide any image in it to display on the modal. You can also change the title in the same way.

 

Please add some css in the div to align image center.

 

Tried in my dev instance it worked for me:

PRINCE_ARORA_0-1679300410202.png

 



If my answer solved your issue, please mark my answer as Correct & 👍Helpful based on the Impact.


View solution in original post

23 REPLIES 23

@akshayp 

so on click of OK one more loading box should be shown?

that is not coming?

Regards,
Ankur
Certified Technical Architect  ||  9x ServiceNow MVP  ||  ServiceNow Community Leader

As of now, on click of ok one loading pop up is coming( please see 3rd screenshot), but i want a loader in same popup exactly as 1st screenshot

  Simply i don't want 2 different pop ups 

@akshayp 

I don't think it's possible to show popup in same 1st popup

Regards,
Ankur
Certified Technical Architect  ||  9x ServiceNow MVP  ||  ServiceNow Community Leader

Ok Thanks

@Ankur Bawiskar , we can do this as well--

If ok is clicked then existing pop up will close and loading pop up will shown (same as 1st screenshot)

Now, can you please help me that how i can close existing pop up if ok is closed and from where i can open second pop up if ok is clicked

(i know how to show that loader)