GlideModal event functions
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
03-03-2023 03:15 PM
Hi All,
Is there a way to find all functions that GlideModal supports? There are OOTB UI actions such as "Add" which use "on beforeclose" as shown in line 15.
I would like to know list of all available functions. Please help.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
03-04-2023 08:12 AM
Hi @Community Alums ,
Below URL is the list of all the functions related to GlideModalv3 from docs.
https://developer.servicenow.com/dev.do#!/reference/api/tokyo/client/c_GlideModalClientSideV3API
Shravan
Please mark this as helpful and correct answer, if this helps you

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
10-24-2023 06:39 AM - edited 10-24-2023 07:34 AM
As far as I know, this is one of those cases where what you need simply is not documented, unfortunately. However, with some tenacity you can uncover the source code yourself and self-learn it to utilize it to its fullest extent.
From client-side, you can find the source-code declaration of GlideModal via this method:
1. Navigate to a form-view (Forms will cause GlideModal to get declared; not all pages declare this variable.)
2. Right-click on a bare whitespace in the form and choose "Inspect" to open the Chrome console focused on that element
3. Type "GlideModal" in the console and press enter, which will make the function print out in your console.
4. Click the printed-out function in your console and it will switch to the "Sources" tab and render out that function's declaration.
5. From there, you can browse the declaration source code "under the hood" and see nearly everything it does, including all the good undocumented stuff.
Here is the location of the GlideModal declaration in our instance. The GlideModal declaration starts on line 8078.
https://[yourBaseUrlHere]/scripts/doctype/js_includes_last_doctype.jsx?v=08-20-2023_0545&lp=Fri_Oct_13_10_24_53_PDT_2023&c=31_931
A few takeaways for your use case:
1. Searching through its declarations, you can see many undocumented methods and their source code.
2. On line 8463, you can see that it has an "on" method for registering its own events.
3. On line 8470, you can see that it has a "fireEvent" method for firing its own events.
4. By searching through the code for "this.fireEvent" you can see the various events that it fires at various points.
- this.fireEvent("bodyrendered", this); (line 8223)
- this.fireEvent('closeconfirm', this); (line 8432)
- this.fireEvent('beforeclose', this); (line 8438)
Using this information, you could create your own example code such as the following:
var gm = new GlideModal();
gm.renderWithContent('<span>hi</span>');
gm.on('beforeclose', function() {alert('gm is closing');});
And then, by testing it, you would confirm that this event fires both by clicking the "X" button and via the focusTrap closure (by clicking outside the modal).
Another risk to consider is that undocumented features are more likely to be altered than documented features. That said, it's often possible to accommodate the future alteration by a future one of your own; it just adds more potential investment down the road for maintaining this solution. Factor this into your risk/reward ratio so that you can make better decisions on whether or not the risk of using an undocumented feature is offset by the reward; crucial features might offset some risk, trivial features not so much. Avoid undocumented features where possible.
Knowing how to inspect the OOTB objects in this way helps you to self-close a lot of the gaps in the documentation. I apologize if you already knew how to do this and was just hoping that these were indeed documented somewhere. To my knowledge they are not.