CODEWITHSUNDEEP
jqueryformsinternet-exploreriframehttps
Baga
Baga

Reputation: 1442

Mixed Content Issue in IE while injecting form inside a dynamic iframe

I am getting Mixed Content Waring message in IE sporadically(not always, this is the main headache), when adding a form to a dynamically added Iframe. (Basically I am using the filedownload jquery plugin, which contains this logic - http://jqueryfiledownload.apphb.com/).

Below is the code. Where fileUrl is a https link to a page in the same site. HttpMethod is POST.

When I replicate the issue while debugging, I found that the warning occurs at formDoc.write line.

$iframe = $("<iframe style='display: none' src=\"javascript:''\"></iframe>").appendTo("body");
formDoc.write("<html><head></head><body><form method='" + settings.httpMethod + "' action='" + fileUrl + "'>" + formInnerHtml + "</form>" + settings.popupWindowTitle + "</body></html>");
$form = $(formDoc).find('form');
$form.submit();


function getiframeDocument($iframe) {
            var iframeDoc = $iframe[0].contentWindow || $iframe[0].contentDocument;
            if (iframeDoc.document) {
                iframeDoc = iframeDoc.document;
            }
            return iframeDoc;
        }

Any insight suggestion would be really helpful. Also, let me know if additional information is required.

Upvotes: 2

Views: 304

Answers (1)

Baga
Baga

Reputation: 1442

Finally we found a solution ourselves. As suggested in other posts we used the idea of setting the iframe src to a bank html file in the server. Only change we made is, we added the form tag to the html itself. And before submitting the form, we wait for the iframe to load. Hope it helps someone!

Dynamic Iframe Loading Code:

$iframe = $("<iframe id='iframeID' style='display: none' src='download.htm'></iframe>").appendTo("body");
           $iframe.load(function () {
               var form = $('#iframeID').contents().find('form')
               var formInnerHtml = '<input type="hidden" name="filename" value="testfile.txt" />';

            form.html(formInnerHtml);
               form.submit();
           });
    }

Content of Blank.html:

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
    </head>
    <body>
        <form method="post" action="ActualDownloadPage.aspx">

        </form>
    </body>
</html>

Upvotes: 2

Related Questions