Wants to copy 3 input type value in single text area

December 5, 2022

Suppose user Name is Rakesh Kumar Yadav, when he type name in 3 parts, I need to print value in singal textarea.
I am using This code
My english is bad.. But I think you were able to understand my issue.

function setaddress() {
  var 1 = document.getElementById('1').value;
  var 2 = document.getElementById('2').value;
  var 3 = document.getElementById('3').value;

  document.getElementById('4').innerHTML = "S/O : " + 1 + ", " + 2 + ", " + 3;
}

<div class="col-md-4">
  <label>First Name</label>
  <input class="form-control" name="1" id="1" type="text" oninput="setaddress()">
</div>
<div class="col-md-4">
  <label>Middle Name</label>
  <input class="form-control" name="2" id="2" type="text" oninput="setaddress()">
</div>
<div class="col-md-4">
  <label>Last Name</label>
  <input class="form-control" name="3" id="3" type="text"  oninput="setaddress()">
</div>
<label>Complete Name</label>
<textarea class="form-control" id="4" name="4" type="text" readonly></textarea>

>Solution :

Avoid starting an id with an Integer
Avoid using Integers as variable name, "S/O : " + 1 how does JS know the 1 is a variable, and not the number one?
The function is not called, I’ve added a button with a onClick

function setaddress() {
  var a = document.getElementById('a').value;
  var b = document.getElementById('b').value;
  var c = document.getElementById('c').value;

  document.getElementById('x').innerHTML = "S/O : " + a + ", " + b + ", " + c;
}

<div class="col-md-4">
  <label>First Name</label>
  <input class="form-control" name="1" id="a" type="text">
</div>
<div class="col-md-4">
  <label>Middle Name</label>
  <input class="form-control" name="2" id="b" type="text">
</div>
<div class="col-md-4">
  <label>Last Name</label>
  <input class="form-control" name="3" id="c" type="text">
</div>
<label>Complete Name</label>
<textarea class="form-control" id="x" name="4" type="text" readonly></textarea>

<br />
<button onclick='setaddress()'>Update</button>