Share
ReportHi All,
I want to show progress indicator on load of the portal entity form as it is taking time to load the page.
Thanks & Regards,
Nandhini M
*This post is locked for comments
You’re offline. This is a read only version of the page.
115
Hi All,
I want to show progress indicator on load of the portal entity form as it is taking time to load the page.
Thanks & Regards,
Nandhini M
*This post is locked for comments
Oliver,
Where in the javascript should the fade-in, fade-out be placed? I am thinking it cannot go into the Ready.
Should it be placed in the entity form or web template?
Also, the div that I placed in the Tracking Code snippet does not appear in the Elements when I use f12 developer's tools (chrome)
Double checking to see if I followed your instructions correctly.
hi.. in fact I did say the snippet name
navigate through your Content Snippets, see if you have one called Tracking Code, if you don't simply create with that name.. make sure the type is HTML, and add this simple DIV through the HTML
<div id="loading"></div>
you don't need to call this snippet anywhere.. it will be called in all the Portal pages that uses the Header/Footer.. so basically the div is present in the entire Portal
hi.. you will need to do a few things for this
first, add the following into your CSS file (can be the OOB bootstrap or if you're using a custom one for yourself it is ok also)
All responses (
Answers (
div#loading {
position: fixed;
background-color: rgba(0, 0, 0, 0.5);
background-image: url("~/loading-gif");
background-repeat: no-repeat;
background-position: center center;
background-size: 50px auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1000000000;
display: none;
}
download any gif file you want to represent your loading icon.. create a Web File and attach this gif there.. the Partial URL has to be the same as the background-image above (I am using "loading-gif")
navigate through your Content Snippets, see if you have one called Tracking Code, if you don't simply create with that name.. make sure the type is HTML, and add this simple DIV through the HTML
<div id="loading"></div>
now you can go to your entity form or pretty much any page in the portal, and call the loading through the following JavaScript:
$("#loading").fadeIn(); // starts the loading
// your code here, you can add a timeout or wait for any element to be ready in the page
$("#loading").fadeOut(); // ends the loading
#1
Mohamed Amine Mahmoudi
83
Super User 2025 Season 1
#2
Community Member
52
#3
dkrishna
6
