Is there a different method I should use to pass a value from one input box to another?
document.getElementById('firstForm2').innerHTML = first; The above code snippet is not working for passing the value, any suggestions on what method I should try instead?
function gerdata() {
//Collect First form Data
var first = document.getElementById("firstForm1").value;
var last = document.getElementById("lastForm1").value;
var phone = document.getElementById("phoneForm1").value;
// transfer to 2nd Form
document.getElementById('firstForm2').innerHTML = first;
document.getElementById('lastForm2').innerHTML = last;
document.getElementById('phoneForm2').innerHTML = phone;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<br><br><br><br>
<form action="">
<h3>Form 1</h3>
<label >First Name</label>
<input id="firstForm1" type="text"><br>
<label>Last Name </label>
<input id="lastForm1" type="text"><br>
<label> Phone Number</label>
<input id="phoneForm1" type="text">
</form>
<br><br>
<form action="" >
<h3>Form 2</h3>
<label >First Name</label>
<input id="firstForm2" type="text"><br>
<label>Last Name </label>
<input id="lastForm2" type="text"><br>
<label> Phone Number</label>
<input id="phoneForm2" type="text">
</form>
<br><br>
<button onclick="gerdata()">transfer data to 2nd Form</button>
<br><br><br><br><br><br><br><br>