How to prevent iframe load event?

Question

I have an iframe and couple of tables on my aspx page. Now when the page loads these tables are hidden. The iframe is used to upload file to database. Depending on the result of the event I have to show a particular table on my main page (these tables basically have "Retry","next" buttons...depending on whether or not the file is uploaded I have to show respective button).

Now I have a JavaScript on the "onload" event of the iframe where I am hiding these tables to start with. When the control comes back after the event I show a particular table. But then the iframe loads again and the tables are hidden. Can any one help me with this problem. I don't want the iframe to load the second time.

Thanks

Answer 1

I am not sure what your problem is, but perhaps your approach should be a little different. Try putting code into the iframe what would call functions of the parent. These functions would display the proper table:

<!-- in the main page --->
function showTable1() {}

<!-- in the iframe -->
window.onload = function () {
    parent.showTable1();
}

This would put a lot of control into your iframe, away from the main page.

Answer 2

I don't have enough specifics from your question to determine if the iframe second load can be prevented. But I would suggest using a javascript variable to check if the iframe is being loaded a second time and in that case skip the logic for hiding the tables,

Answer 3

This is my code

function initUpload() { //alert("IFrame loads"); _divFrame = document.getElementById('divFrame'); _divUploadMessage = document.getElementById('divUploadMessage'); _divUploadProgress = document.getElementById('divUploadProgress'); _ifrFile = document.getElementById('ifrFile'); _tbRetry = document.getElementById('tbRetry'); _tbNext=document.getElementById('tblNext');

         _tbRetry.style.display='none';
         _tbNext.style.display='none';

        var btnUpload = _ifrFile.contentWindow.document.getElementById('btnUpload');

        btnUpload.onclick = function(event)
        {
            var myFile = _ifrFile.contentWindow.document.getElementById('myFile');

            //Baisic validation
            _divUploadMessage.style.display = 'none';


            if (myFile.value.length == 0)
            {
                _divUploadMessage.innerHTML = '<span style=\"color:#ff0000\">Please select a file.</span>';
                _divUploadMessage.style.display = '';
                myFile.focus();
                return;
            }

            var regExp = /^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))(.doc|.txt|.xls|.docx |.xlsx)$/;

            if (!regExp.test(myFile.value)) //Somehow the expression does not work in Opera
            {
                _divUploadMessage.innerHTML = '<span style=\"color:#ff0000\">Invalid file type. Only supports doc, txt, xls.</span>';
                _divUploadMessage.style.display = '';
                myFile.focus();
                return;
            }


            _ifrFile.contentWindow.document.getElementById('Upload').submit();
            _divFrame.style.display = 'none';


        }
    }

function UploadComplete(message, isError) { alert(message); //alert(isError);

         clearUploadProgress();


        if (_UploadProgressTimer)
        {
            clearTimeout(_UploadProgressTimer);
        }

        _divUploadProgress.style.display = 'none';
        _divUploadMessage.style.display = 'none';
        _divFrame.style.display = 'none';
        _tbNext.style.display='';

        if (message.length)
        {
            var color = (isError) ?  '#008000' : '#ff0000';

            _divUploadMessage.innerHTML = '<span style=\"color:' + color + '\;font-weight:bold">' + message + '</span>';
            _divUploadMessage.style.display = '';
            _tbNext.style.display='';
             _tbRetry.style.display='none';



        }
    }

tblRetry and tblNext are the tables that I want to display depending on the result of the event.

Answer 4

mmm you said you're on aspx page, I suppose that the iframe do a postback, so for this it reload the page. If you can't avoid the postback, you've to set a flag on the main page just before posting back, and check against that while you're loading...

...something like:

mainpage.waitTillPostBack =  true
YourFunctionCausingPostBack();


..

onload=function(){
if(!mainpage.waitTillPostBack){
hideTables();
}
mainpage.waitTillPostBack = false;
}