Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I encountered this problem when trying to show a loading gif while a form submit was processing. It had an added layer of fun in that the same onsubmit had to run a validator to make sure the form was correct. Like everyone else (on every IE/gif form post on the internet) I couldn't get the loading spinner to "spin" in IE (and, in my case, validate/submit the form). While looking through advice on <a href="http://www.west-wind.com/weblog/posts/2004/Dec/27/Animated-GIF-images-in-hidden-page-elements" rel="nofollow" title="west-wind.com see ev13wt's post">http://www.west-wind.com</a> I found a post by ev13wt that suggested the problem was "... that IE doesn't render the image as animated cause it was invisible when it was rendered." That made sense. His solution: </p> <p><strong>Leave blank where the gif would go and use JavaScript to set the source in the onsubmit function - document.getElementById('loadingGif').src = "path to gif file".</strong></p> <p>Here's how I implemented it:</p> <pre><code>&lt;script type="text/javascript"&gt; function validateForm(form) { if (isNotEmptyid(form.A)) { if (isLen4(form.B)) { if (isNotEmptydt(form.C)) { if (isNumber(form.D)) { if (isLen6(form.E)){ if (isNotEmptynum(form.F)) { if (isLen5(form.G)){ document.getElementById('tabs').style.display = "none"; document.getElementById('dvloader').style.display = "block"; document.getElementById('loadingGif').src = "/images/ajax-loader.gif"; return true; } } } } } } } return false; } &lt;/script&gt; &lt;form name="payo" action="process" method="post" onsubmit="return validateForm(this)"&gt; &lt;!-- FORM INPUTS... --&gt; &lt;input type="submit" name="submit" value=" Authorize "&gt; &lt;div style="display:none" id="dvloader"&gt; &lt;img id="loadingGif" src="" alt="Animated Image that appears during processing of document." /&gt; Working... this process may take several minutes. &lt;/div&gt; &lt;/form&gt; </code></pre> <p>This worked well for me in all browsers!</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload