How to create content on a page that is within iframe using innerHTML

Asked

Viewed 751 times

0

Hello,

I have the three pages listed below, an index.html (which contains an iframe), another that lists students according to the CPF typed on the previous page and javascript.

I’m wanting the function to list Luno() that is loaded along with the page listAluno.html create a button for each student corresponding to the reported CPF;

However, I don’t know exactly how to identify the DIV.

have the page index.html

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SISGE - Prototipo Matricula</title>
<link rel="stylesheet" type="text/css" href="estilo.css" />
<script type="text/javascript" src="javascript.js"/>

</script>
</head>
<body>
<div id="header">
    <img src="i/logo.jpg"/>
    <iframe name="frameConteudo" class="frameConteudo" src="listaAluno.html" scrolling="no"></iframe>
</div>

</body>
</html>

the javascript code (javascript js.)

    // JAVASCRIPT CRIADO POR RENOIR FARIA //
var cpfResponsavel;
var cepResponsavel;
var form;
function Aluno(cpf,nome,dtNasc,nomeMae,turno,escola) {
  this.cpf     = cpf;
  this.nome    = nome;
  this.dtNasc  = dtNasc;
  this.nomeMae = nomeMae;
  this.turno   = turno;
  this.escola  = escola;
}
var aluno = new Array();
aluno[0]  = new Aluno ("111","Estagiario","11/02/1994","Hayley de Paula");
aluno[1]  = new Aluno ("04050816180","Beta","11/02/1994","TIM");

function consiste(op,form) {
  switch (op) {
    case "continuar":
      if (form.CPF.value === "") {
        alert("CAMPO CPF VAZIO");
        form.CPF.focus();
        return false;
      }
      if (form.CEP.value === "") {
        alert("CAMPO CEP VAZIO");
        return false;
      }
    break;
  }
  return true;
}

function ehAlunoNovo(cpf) {
  var result = true;
  for (i = 0; i < aluno.length; i++) {
      if (aluno[i].cpf === cpf) {
        result = false;
      }
  }
  return result;
}

function continuar(form) {
  form = form;
  if (consiste("continuar",form)) {
     cpfResponsavel = form.CPF.value;
     cepResponsavel = form.CEP.value;
      if (ehAlunoNovo(cpfResponsavel)) {
         frameConteudo.location = 'alunoNovo.html';
      }
      else {
         frameConteudo.location = 'listaAluno.html';
      }
  }

  }

  function listaAluno () {
    var criarLista = "<button ";
    for (i = 0; i < aluno.length; i++) {
        if (aluno[i].cpf == cpfResponsavel) {
           criarLista += "onclick=\"selecAluno("+i+")\">" + aluno[i].nome;
        }
    }
    criarLista += "</button>";

  }

and the page contained in the iframe (listAluno.html)

    <!DOCTYPE html>
<html>
<head>
  <title>Lista Aluno</title>
  <link rel="stylesheet" type="text/css" href="estilo.css" />
  <script type="text/javascript" src="javascript.js"/>
</head>
<body onload="listaAluno();">
<div id="divLista">
</div>
</body>
</html>
javascript iframe

1 answer

1

Try this:

First put id in iframe:

 <iframe name="frameConteudo" id="frameConteudo" class="frameConteudo" src="listaAluno.html" scrolling="no"></iframe>

Then call it that: 

document.getElementById('frameConteudo').contentWindow.document.getElementById('divLista')

Browser other questions tagged javascript iframe

You are not signed in. Login or sign up in order to post.