1

I have a node application and inside the index.html there is the following code that adds the header, the footer, etc in every page of my application:

<body ng-app="myApp" class="paper-theme">

  <div id="wrapper" class="container-fluid" ng-controller="MainCtrl">

    <div ng-include="'views/header.html'"> </div>

    <div class="row">

      <div class="col-sm-3 col-md-2 sidebar">

          <div ng-include="'views/sidebar.html'"></div>

      </div>

      <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main p-5">

        <div ng-include="'views/breadcrumbs.html'"></div>

        <div class="ng-view"></div>

      </div>

    </div>

  </div>

  <!-- /. WRAPPER  -->

  <div ng-include="'views/footer.html'"> </div>

</body>

On a specific page (training.html) I added an iframe to show the lab selected:

  <iframe id="iframe0" name="myIframe" frameborder="5" width="1500" height="1500"></iframe>

And in the controller (trainingCtrl.js), inside a function, I have the following code to show the selected lab:

...
  for (var i=0; i<d.children.length; i++) {
    lab=d.children[i].name;
    $('#iframe'+i).attr('src', 'http://localhost:18181/lab/use/NS/'+lab);
...
  };

When loading the iframe, the lab is loaded but with the same header of the main page. So I want to delete it. I tried various solutions like:

$("#iFrameId").contents().find("#yourDiv").empty();

or

$('#iFrameId').contents().find('.entry-footer').remove();

but none of them work.

This is what my page looks like and what I would like to delete. enter image description here

Patrick Yoder
  • 1,065
  • 4
  • 14
  • 19
MaxyCar
  • 79
  • 7

1 Answers1

0

Unfortunately you can't edit iframe content from outside of it. This is to prevent third parties from customising the iframe content with possibly malicious code.

You should explore options about creating alternative headless version of your page or alternative is to check if your page is being loaded in iframe and then edit it's contents accordingly. If you choose latter option this solution should help you getting forwards: How to identify if a webpage is being loaded inside an iframe or directly into the browser window?