CODEWITHSUNDEEP
javascriptjquerycssiframe
Radek
Radek

Reputation: 11121

div is not found in iframe

I got to fix an issue after a product was upgraded to the latest version. The html was changed so the objects that are inside iframe and supposed to be hiden are visible now.

I did not do the customization to display the product inside iframe and I do not really understand how it works but I was told that I should look at this file iframeloader.aspx in particular function called function hideTitle()

I do not have access to the main application only to the iframe one. I can edit iframeloader.aspx. I update the original hideTitle function so it looks 

  function hideTitle() {         

      var ele = $('#contentFrame');
      ele.load(function() {
console.log("test")
      var menubar = $('#header');
          if (menubar) {
console.log("test2")    
console.log(document.getElementById("header").style.display);
console.log(menubar.html())
              menubar.css("display", "none");
          }
      });
  }

in console I can see this

test - iframel...strator (line 700)
test2 - iframel...strator (line 704)
TypeError: document.getElementById(...) is null

in firebug I can see the html <div id="header">

When the page loads I can see the object I want to hide appearing and then later on messages from console.log()

Any idea

Upvotes: 2

Views: 245

Answers (1)

omikes
omikes

Reputation: 8533

Hide it with this: $('#header').hide()

The stuff inside the iframe is hard to reach because it becomes a new window, modify it with this:

$('some selector', frames['nameOfMyIframe'].document).doStuff();

Upvotes: 2

Related Questions