JavaScript/HTML: How to display user input into html body?

Question

heres my html form:

<label>Name:</label><input type ="text" input id="myName" /><br>
<label>Street:</label><input type="text" input id="myStreet" /><br>
<label>City:</label><input type="text" input id="myCity" /><br>
<label>State:</label> <input type="text" input id="myState" /><br>
<label>Zip:</label> <input type="text" input id="myZip" /><br>

<input type="submit" value="Submit" onclick="myAlert()">
</form>
//my myAlertFunc (from external file) 

function myAlert(){
    var person = new Person(document.getElementById('myName').value, document.getElementById("myStreet").value, document.getElementById("myCity").value, document.getElementById("myState").value, document.getElementById("myZip").value);
    alert(person.getFullAddress());
}

//and my getFullAddress proto from my Person class

Person.prototype.getFullAddress = function () {
    return ("Hi, my name is" + " " + this.name + "," + " " + "and my address is:" + " " + this.street + "," + this.city + "," + this.state + "," + this.zip);
};

Now, onclick, the myAlertFunc alerts the users input values. How do I display these values in my html body? I know I am supposed to use a element with just an input id and use document.getElementById(); to call that id but i have no idea what to do after that.

Thanks in advance!

We need the Person function declaration

Niccolò Campolungo
– Niccolò Campolungo

2013-06-18 21:14:32 +00:00
Commented Jun 18, 2013 at 21:14 — Niccolò Campolungo
– Niccolò Campolungo, Commented Jun 18, 2013 at 21:14

optimarcusprime · Accepted Answer · 2013-06-18 21:32:34Z

3

The attribute you're looking for is innerHTML: http://www.w3schools.com/jsref/prop_html_innerhtml.asp

So, your code would be something along the lines of:

// alert(person.getFullAddress());
document.getElementById("resultDiv").innerHTML = person.getFullAddress();

Where "resultDiv" is the ID of the element where you want the result to display.

Good luck!

answered Jun 18, 2013 at 21:32

optimarcusprime

964 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

BerinHardt · Accepted Answer · 2013-06-18 21:17:20Z

2

you can set the innerHTML of the element or its value if it's an input

answered Jun 18, 2013 at 21:17

BerinHardt

1551 silver badge7 bronze badges

Collectives™ on Stack Overflow

JavaScript/HTML: How to display user input into html body?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related