Objeto nao aparece na tela

1. Objeto nao aparece na tela

carlos alessandro fernandes de oliveira
cacabrazil

(usa Outra)

Enviado em 06/06/2021 - 00:25h

Entao, tenho esse codigo ai bugado, "document.getElementById('nomeSala').innerHTML = salas.PAnoA[0].nome;" no final, ele diz que e undefined, mas n sei pq,
"salas.PAnoA[0].nome", esta certo, pois ja consegui ver o valor dentro com um alert, so que em outro bloco de codigo, estou desconfiado qe e alguma coisa relacionado ao escopo, mas coloquei tudo pra fora, todas as variaveis, pra n ter problema. Mas ainda tem kkk. "salas.PAnoA[0].nome", aqui dentro teria um nome, que e puxado de um outro aquivo HTML, tenho ctz que o problema nao esta la, mas nesse ai embaixo.



var salas={

}
var cont = 0
var nomeTurma
var letra
var Turma
var nomeTurmaP
var nomeTurmaS
var nomeTurmaT
var nomeAluno
/*
var salas=[nomeTurmaP + letra] = [0]
salas[nomeTurmaP + letra][0] = {
nome: document.getElementById("inputext" + 0).value,
idade: 2021 - (document.getElementById("inputnumber" + 0).value),
sexo: document.getElementById("inputsexo" + 0).value

}
*/


if (localStorage.getItem('logado') == 'false') {
window.location.href = './login.html';
}

function sair() {
localStorage.getItem('logado') = 'false'
}

function mostrar() {
document.getElementById('container-consultar').style.display = "none"

if (document.getElementById('container-anos').style.display == "none") {
document.getElementById('container-anos').style.display = "block"
} else {
document.getElementById('container-anos').style.display = "none"
}
}



document.getElementById("user").addEventListener('click', function () {

if (document.getElementById('btn-sair').style.display == "none") {
document.getElementById('btn-sair').style.display = "block";
} else {
document.getElementById('btn-sair').style.display = "none";
}

});

//add alunos
document.getElementById('add-alunos').addEventListener('click', function () {
alert(cont)
var alunos = '<label id="input' + cont + '" style="display:inline-block;"><input type="text" id="inputext' + cont + '" required placeholder="Nome do Aluno"> <input type="number" placeholder="Ano de nascimento" id="inputnumber' + cont + '" required> <select id="inputsexo' + cont + '"><option >Masculino</option value="Masculino"><option>Feminino</option value="Feminino"></select></label><label id="notas"><input type="number" required placeholder="Nota 1" class="notas" id="nota1"></input><input type="number" required placeholder="Nota 2" class="notas" id="nota2"></input><input type="number" required placeholder="Nota 3" class="notas" id="nota3"></input><input type="number" class="notas" id="nota4" placeholder="Nota 4" required></input></label><br><br>'
cont = cont + 1
document.getElementById('container-criaralunos').innerHTML = document.getElementById('container-criaralunos').innerHTML + alunos

});
/* fim */

//remove alunos
function removerAlunos() {
if (cont != 0) {
cont = cont - 1
}

document.getElementById("input" + cont).remove();
}
/* fim */

/* valida informaçoes do submit*/

document.querySelector('form').addEventListener('submit', function (event) {

nomeTurma = document.getElementById('selecionar_nome').value
letra = document.getElementById('selecionar_nomeano').value


if (document.getElementById('inputext0') != null) {
nomeTurma = document.getElementById('selecionar_nome').value;
letra = document.getElementById('selecionar_nomeano').value;
Turma = nomeTurma + letra;

//letras = ['A','B', 'C','D', 'E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];


for (i = 0; i < cont; i++) {

if (nomeTurma == '1Ano') {
nomeTurmaP = 'PAno'

salas[nomeTurmaP + letra] = [i]
salas[nomeTurmaP + letra][i] = {
nome: document.getElementById("inputext" + i).value,
idade: 2021 - (document.getElementById("inputnumber" + i).value),
sexo: document.getElementById("inputsexo" + i).value

}

//nomeAluno = salas.PAnoA[0].nome

}
if (nomeTurma == '2Ano') {
nomeTurmaS = 'SAno'

salas[nomeTurmaS + letra] = [i]
salas[nomeTurmaS + letra][i] = {
nome: document.getElementById("inputext" + i).value,
idade: 2021 - (document.getElementById("inputnumber" + i).value)
}

}
if (nomeTurma == '3Ano') {
nomeTurmaT = 'TAno'

salas[nomeTurmaT + letra] = [i]
salas[nomeTurmaT + letra][i] = {
nome: document.getElementById("inputext" + i).value,
idade: 2021 - (document.getElementById("inputnumber" + i).value)
}

}


}


}

if (document.getElementById('inputext0') == null) {
//alert("erro")
event.preventDefault();
document.getElementById('erro').style.display = "block";
}


}); //alert(salas.PAnoA[0].nome+'oi')
/* consulta informaçoes dos alunos */
document.getElementById('consultar-turma').addEventListener('click', function () {

document.getElementById('container-anos').style.display = "none"
//alert(salas.PAnoA[0].nome)



if (document.getElementById('container-consultar').style.display == "none") {
document.getElementById('container-consultar').style.display = "block"
} else {
document.getElementById('container-consultar').style.display = "none"
}
// alert(nomeAluno)
document.getElementById('nomeSala').innerHTML = salas.PAnoA[0].nome;

})





@import url('https://fonts.googleapis.com/css2? family = Roboto: wght @ 300 & display = swap');

body {
margin: 0;
padding: 0;
font-family: 'Roboto', sans-serif;
height: 100%;
background: url(../banco_de_imagens/Background.png);
color:#fff;
}

html {
margin: 0;
padding: 0;
font-family: 'Roboto', sans-serif;
height: 100%;
width: 100%;
}

nav {
background: #4B4697;
width: 100%;
height: 8vh;
margin: 0;
box-sizing: border-box;
box-shadow: #373370 2px 2px 10px 2px;
/* border-bottom:2px solid #2b2666; */
}

#user {
width: 40px;
height: 40px;
position: absolute;
left: 94%;
border: 2px solid rgb(223, 218, 218);
border-radius: 100%;
background: rgba(15, 15, 15, 0.418);
display: inline-block;
}

#sistemaescolar {
margin: 0;
width: auto;
padding-left: 5%;
padding-top: 0%;
display: inline-block;
color: rgb(255, 255, 255);
font-weight: 600;
font-size: 30pt;
}

ol {
display: inline-block;
margin: 0;
}

#btn-sair {
background: white;
border: 2px solid rgba(196, 189, 189, 0.664);
position: absolute;
width: 90px;
height: 40px;
text-align: center;
margin: 0px 0vh 0vh -1%;
left: 198vh;
list-style: none;
text-decoration: none;

}

.tag-grouping {
font-weight: 600;
font-size: 15pt;
border: 2px solid rgba(0, 0, 0, 0.041);
width: 25vh;
height: auto;
background: rgba(92, 89, 89, 0.199);
cursor: pointer;
margin-left: 25%;
margin-top: 5%;
text-align: center;
display: inline-block;
}

.tag-grouping:active {
background: rgba(92, 89, 89, 0.383);
}




#img-mais, #img-lupa {
width: 11%;
height: 11%;
}


#container-anos {
background: rgba(165, 162, 162, 0.308);
height: auto;
width: 50%;
margin: 0% auto 0% auto;
padding-left: 15px;
font-family: 'Roboto', sans-serif;
font-size: 18pt;
border-radius: 5%;
box-shadow: rgb(36, 36, 36) 0px 2px 20px 2px;
}

#container-ano>select {
display: inline-block;
}

select {
font-size: 15pt;
}

input {
display: inline-block;
outline: none;
border: none;
width: 50%;
height: 15%;
margin-bottom: 1%;
font-size: 18pt;
}

input[type="number"] {
display: inline-block;
outline: none;
border: none;
width: 25%;
height: 15%;
margin-bottom: 1%;
font-size: 18pt;

}

#add-alunos {
cursor: pointer;
}

#remove-alunos {
cursor: pointer;
}
#nota1, #nota2, #nota3, #nota4{
width: 15%;
}


button {
margin: auto;
}
#erro{
font-weight: 100;
text-align: center;
margin: 4% auto 4% -15px;
text-indent: 0;
background-color: rgb(255, 85, 43);
color: white;
}

#container-consultar{
background: rgba(165, 162, 162, 0.308);
height: auto;
width: 50%;
margin: 0% auto 0% auto;
padding-left: 15px;
font-family: 'Roboto', sans-serif;
font-size: 18pt;
border-radius: 5%;
box-shadow: rgb(36, 36, 36) 0px 2px 20px 2px;
}


footer {
text-align: center;
background: rgba(0, 0, 0, 0.342);
width: 100%;
height: 10%;
margin-top: 58vh;

}





<!DOCTYPE html>
<html lang="pt-br">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="home.css">
<title>Home</title>
</head>

<body>
<header>
<nav>
<p id="sistemaescolar">Sistema Escolar</p>
<img id="user" src="../banco_de_imagens/user.png" alt="User">
<a href="./login.html" target="_blank" style="display:none" onclick="sair()">Sair</a>
</nav>

</header>


<p style="display: none;" id="btn-sair"><a href="./login.html" target="_self">Sair</a></p>

<div class="tag-grouping" id="tag-grouping" onclick="mostrar()">
<img src="../banco_de_imagens/mais.png" alt="img" id="img-mais">
<p>Criar Turma</p>
</div>
<div class="tag-grouping" id="consultar-turma">
<img src="../banco_de_imagens/lupa.png" alt="img" id="img-lupa">
<p>Consultar Turma</p>
</div>


<div id="container-anos" style="display: none;">
<form action="">
<label id="txts">
<p>Nome Sala</p>
<label id="inputs">
<select name="selecionar" id="selecionar_nome">
<option value="1Ano">1 Ano</option>
<option value="2Ano">2 Ano</option>
<option value="3Ano">3 Ano</option>
</select>
<select name="selecionar" id="selecionar_nomeano">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option>

</select>
</label>
<p>Alunos</p>

<label>
<p id="add-alunos" onclick="adicionarAluno()">
<img src="../banco_de_imagens/mais.png" alt="img" style="width: 25px; border-radius: 100%; border:2px solid rgba(31, 28, 28, 0.171);">
Adicionar Alunos
</p>

<p id="remove-alunos" onclick="removerAlunos()">
<img src="../banco_de_imagens/menos.png" style="width: 25px;border-radius: 100%;border:2px solid rgba(31, 28, 28, 0.171);" alt="img">
Remover Aluno
</p>

<div id="container-criaralunos">

</div>

<div style="display: none;" id="erro">
<p>Dados incompletos!!</p>
</div>

</label>


</label>
<button style="width: 20%;height: 20%; font-size: 15pt;">Criar</button>

</form>

</div>

<div style="display: none;" id="container-consultar">
<p>Sala:<p id="nomeSala"></p></p>





</div>

<script src="home.js"></script>
<footer>
<address>
<hr>
&copy;Carlos Alessandro
</address>
</footer>
</body>

</html>




  


2. Re: Objeto nao aparece na tela

Marcelo Oliver
msoliver

(usa Debian)

Enviado em 06/06/2021 - 05:04h

Posta inteiro, só o javascript bugado , é complicado....


______________________________________________________________________
Importante: lynx --dump goo.gl/a9KeFc|sed -nr '/^[ ]+Se/,/dou.$/p'
Att.: Marcelo Oliver
______________________________________________________________________



3. Re: Objeto nao aparece na tela

carlos alessandro fernandes de oliveira
cacabrazil

(usa Outra)

Enviado em 06/06/2021 - 11:52h


msoliver escreveu:

Posta inteiro, só o javascript bugado , é complicado....


______________________________________________________________________
Importante: lynx --dump goo.gl/a9KeFc|sed -nr '/^[ ]+Se/,/dou.$/p'
Att.: Marcelo Oliver
______________________________________________________________________


Pronto