StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>You could use the <code>onsubmit</code> event of your page's form. This happens before the form is submitted, and will allow you to stop submission of the form if you need by cancel bubbling. In case you need this, the last 2 lines in this example will cancel bubbling across browsers.</p> <pre><code><form runat="server" onsubmit="ShowLoading()"> </form> <script type="text/javascript"> function ShowLoading(e) { var div = document.createElement('div'); var img = document.createElement('img'); img.src = 'http://www.oppenheim.com.au/wp-content/uploads/2007/08/ajax-loader-1.gif'; div.innerHTML = "Loading...<br />"; div.style.cssText = 'position: fixed; top: 30%; left: 40%; z-index: 5000; width: 222px; text-align: center; background: #fff; border: 1px solid #000'; div.appendChild(img); document.body.appendChild(div); // These 2 lines cancel form submission, so only use if needed. window.event.cancelBubble = true; e.stopPropagation(); } </script> </code></pre> <p>The JavaScript above is just for example, however this is (in my opinion) the preferred way to do what you're looking for. It looks something like this (in the center of the screen):</p> <blockquote> <p>Loading...<br /> <a href="http://www.oppenheim.com.au/wp-content/uploads/2007/08/ajax-loader-1.gif">http://www.oppenheim.com.au/wp-content/uploads/2007/08/ajax-loader-1.gif</a></p> </blockquote> <p>This will work for any element that raises a PostBack, so you don't have to manually call <code>ShowLoading()</code> on every button or form element you may have on your page. I would replace the contents of <code>ShowLoading()</code> with some real loading functionality and not just the example code I threw together.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

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