Databases
StackOverflow2013
Postsdbo
POIFrame OnReadyStateChange function
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POIFrame OnReadyStateChange function
    text
    copied!<p>I have an asp.webforms application and on page a i have a hidden div with progressbar and iframe. To iframe i try loaded form from another application on same domain.</p> <pre><code>&lt;div id="pagePreview" style="display: none;"&gt; &lt;div class="progressBarWrapper" id="waitDialog" style="opacity:1;filter:alpha(opacity=100);display:none;"&gt; &lt;div class="progressBarDetail" style="margin-top:25%;"&gt; &lt;asp:Image ID="imgLoading" runat="server" ImageUrl="~/Images/wait.gif" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;iframe id="previewContent" onreadystatechange="iframeLoaded(this);"&gt;&lt;/iframe&gt; &lt;/div&gt; </code></pre> <p>On a click event i call a function to show this div in jqueryUI dialog and i Want show progressbar until the page in Iframe is not loaded.</p> <pre><code>var isClickedForDialog = false; function iframeLoaded(args) { if (args.readyState == "complete" &amp;&amp; isClickedForDialog) { var pagePreview = $('#pagePreview'); // dialog var waitDialog = $('#waitDialog'); // progress waitDialog.hide(); isClickedForDialog = false; } } function showModalWindow(url, hideCloseButton) { isClickedForDialog = true; var previewContent = $('#previewContent'); // Iframe var pagePreview = $('#pagePreview'); // dialog var waitDialog = $('#waitDialog'); // progresss waitDialog.show(); previewContent.attr('src', url); pagePreview.dialog( { draggable: false, resizable: false, height: 764, width: 1020, modal: true, close: function (event, ui) { previewContent.attr('src', ''); }, open: function (event, ui) { if (hideCloseButton) { $(this).parent().children().children('.ui-dialog-titlebar-close').hide(); } } }); } </code></pre> <p>In IE everything works fine. The dialog box and progressbar displays and when the URL is loaded in an iframe, progressbar disappears and i see only webforms in IFrame.</p> <p>But in FireFox and Chrome this does not work.</p> <p>The browser ignores the onreadystatechange event. I tried to handle an event as following:</p> <pre><code>$('#previewContent').bind('onreadystatechange', iframeLoaded, false); $('#previewContent').on('onreadystatechange', iframeLoaded); </code></pre> <p>but without success.</p> <p>know how to solve this? thanks</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