Alagesan Palani
Alagesan Palani

Reputation: 2014

javascript function convert into jquery equivalent

I have a javascript function written as follows which works just fine in Firefox for downloading given txt content.

  self.downloadURL = function (url) {
        var iframe;
        iframe = document.getElementById("hiddenDownloader");        
        if (iframe === null) {
            iframe = document.createElement('iframe');
            iframe.id = "hiddenDownloader";
            iframe.style.display = "none";
            document.body.appendChild(iframe);
        }
        iframe.src = url;
    }

but it does n't work fine with IE 9 due to some reasons. So i tried to convert into equivalent jquery because jquery has compatibility with all the browsers.

here is the jquery equivalent of the same function:

   self.downloadURL = function (url) {
        var iframe;
        iframe = $("#hiddenDownloader");        
        if (iframe === null) {
            iframe = $('<iframe></iframe>');
            iframe.id = "hiddenDownloader";            
            $("#hiddenDownloader").css("display", "none");
            $(document.body).append(iframe);
        }
        iframe.src = url;
    }

But now it does n't work in both the browsers. Please help letting me know what am i doing wrong.

Upvotes: 0

Views: 188

Answers (6)

RunningAdithya
RunningAdithya

Reputation: 1754

Try with:

iframe = $("#hiddenDownloader")[0];

Upvotes: 0

Khanh TO
Khanh TO

Reputation: 48972

  • Replace iframe.src = url; with iframe.attr("src",url + "?"+ Math.random()); to prevent caching issue in IE9.
  • Replace iframe.id = "hiddenDownloader"; with iframe.attr("id","hiddenDownloader");
  • Replace if (iframe === null) { with if (iframe.length === 0) {

Upvotes: 0

This link may help u:

http://www.sitepoint.com/forums/showthread.php?743000-IE9-Iframes-DOCTYPES-and-You

or u can add this to the top:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Upvotes: 0

Andreas Louv
Andreas Louv

Reputation: 47099

Your problem is in:

iframe = $('<iframe></iframe>');
iframe.id = "hiddenDownloader";       

iframe refers to a jQuery Object not a DOM Node. You will have to use .prop to set the id:

iframe = $('<iframe></iframe>');
iframe.prop('id', "hiddenDownloader");       

And also you have the same problem here:

if (iframe === null) {

Where you will need the check the length of iframe:

if (iframe.length === 0) {

And again at iframe.src = url; Maybe you can figure this one out:

iframe.attr('src', url);

But why would you convert vanilla JavaScript to jQuery?

Upvotes: 9

EvenStevens
EvenStevens

Reputation: 310

iframe = document.getElementById("hiddenDownloader");          
iframe = $("#hiddenDownloader");        

These lines aren't equivalent. The second one create a jQuery object, so the check for null will never equate to true

Upvotes: 0

David-SkyMesh
David-SkyMesh

Reputation: 5171

Seems like a strange way to download a file.

In any case, this probably works the same was as the original:

if (!iframe.get(0)) {
  ...
}

... and the id property as another poster mentions.

Upvotes: 0

Related Questions