CODEWITHSUNDEEP
htmlweb
Rin_asdfghjkl
Rin_asdfghjkl

Reputation: 65

How to display object values on a webpage

I am trying to get user's input from multiple fields. So here's my javascript to get the value from the html contents::

var myButton = document.getElementById('button');
var inp = document.getElementById('myInput');
var inpw = document.getElementById('myPW');

And here where I would like to display the inputs:

<h2>Data</h2>
<p id="val"></p>

What I've done is:

myButton.addEventListener('click', function(event) {
    event.preventDefault();

    const object1 = {
        un: inp,
        pw: inpw
    };

    document.getElementById('val').innerHTML = Object.values(object1);
});

But the result is:

[object HTMLInputElement],[object HTMLInputElement]

Upvotes: 0

Views: 1079

Answers (1)

Rin_asdfghjkl
Rin_asdfghjkl

Reputation: 65

I already figure it out:

const object1 = {
        un: inp.value,
        pw: inpw.value
    };
    var myJSON = JSON.stringify(object1);

    document.getElementById('val').innerHTML = myJSON;

Output: {"un":"erin","pw":"pdds"}

Upvotes: 1

Related Questions