Make user-written data stored in a JS object

Question

Make user-written data stored in a JS object

Navigation

#1 by (1 votes)
#2 by (1 votes)

1

I have this code and I wanted to know how best to get the user to push a button and, from there, store the data requested by the page in the JS object and, after that, display the message written in the code . Could someone help? Thank you.

JS

var aluno = new Object ()
aluno.nome = document.getElementById("nome");
aluno.telefone = document.getElementById("telefone");
aluno.matricula = document.getElementById("matricula");

aluno.curso = new Object ()
    curso.nome = document.getElementById("curso");
    curso.campus = document.getElementById("campus");
    curso.turno = document.getElementById("turno");

document.write ("Olá " + aluno.nome + ", seu telefone é: " + aluno.telefone + " e sua matrícula é: " +
aluno.matricula + "." + " Você está matriculado no curso " + curso.nome + ", no campus " + curso.campus + 
" durante a parte da " + curso.turno)

HTML

        <h4>Dados do Aluno</h6>
        <p>Informe o seu nome: <input type="text" id="nome"></p>
        <p>Informe o seu telefone: <input type="number=" id="telefone"></p>
        <p>Informe a sua matrícula: <input type="number" id="matricula"></p>
    </div>
    <div class="curso">
        <h4>Dados do Curso</h6>
        <p>Informe o nome do seu curso: <input type="text" id="curso"></p>
        <p>Informe o seu campus: <input type="text=" id="campus"></p>
        <p>Informe a seu turno: <input type="text" id="turno"></p>
    </div>

javascript html object

asked by anonymous 23.05.2018 / 22:57

2 answers

1

You are picking up the element and not the value of it. You need to get the value attribute of the input element, type this:

aluno.nome = document.getElementById("nome").value;

If you put all this JS code in a function, add the function in an onclick event in the HTML button.

23.05.2018 / 23:14

How events work in jquery Problem in storing combobox label in HTML

score 1 · Accepted Answer

In addition to putting .value as reported in Gabriel's response, you can do this by calling a function and sending the text into div instead of using document.write :

function exibe(){
   var aluno = new Object();
   aluno.nome = document.getElementById("nome").value;
   aluno.telefone = document.getElementById("telefone").value;
   aluno.matricula = document.getElementById("matricula").value;
   
   aluno.curso = new Object ()
       curso.nome = document.getElementById("curso").value;
       curso.campus = document.getElementById("campus").value;
       curso.turno = document.getElementById("turno").value;
   
   document.getElementById("dados").innerHTML = "Olá " + aluno.nome + ", seu telefone é: " + aluno.telefone + " e sua matrícula é: " +
   aluno.matricula + "." + " Você está matriculado no curso " + curso.nome + ", no campus " + curso.campus + 
   " durante a parte da " + curso.turno;
}

<h4>Dados do Aluno</h6>
        <p>Informe o seu nome: <input type="text" id="nome"></p>
        <p>Informe o seu telefone: <input type="number=" id="telefone"></p>
        <p>Informe a sua matrícula: <input type="number" id="matricula"></p>
    </div>
    <div class="curso">
        <h4>Dados do Curso</h6>
        <p>Informe o nome do seu curso: <input type="text" id="curso"></p>
        <p>Informe o seu campus: <input type="text=" id="campus"></p>
        <p>Informe a seu turno: <input type="text" id="turno"></p>
    </div>
<button onclick="exibe()">Exibir dados</button>
<br>
<div id="dados"></div>