Question posted in
You can find the official documentation here.

How can i pass the value of multiple input box to another single input or textarea – Jquery ajax

<input type='text' name='name' id='name'>
<input type='date' name='date' id='date'>
<textarea name='text' id='text'></textarea>

Expected Output (in textarea box): My "name" and date is "date".

Tags:

4

Answers


  1. 0

    Like this?

    var input = document.getElementsByTagName("input")[0];
var date = document.getElementsByTagName("input")[1];
var textarea = document.getElementsByTagName("textarea")[0];
go();
function go(){
  textarea.innerHTML="My "+input.value+" and date is "+date.value;
}
    <input type='text' name='name' id='name' oninput="go()" value="Spectric">
<input type='date' name='date' id='date' oninput="go()" value="2021-01-25">
<textarea name='text' id='text'></textarea>
    Login or Signup to reply.
  2. 0

    you can do that with vanila java script just apply change event on both of the first input and append the value of it to the value of textarea

    this is html code

    <script src="./index.js" defer></script>
<input type='text' name='name' id='name'>
<input type='date' name='date' id='date'>
<textarea name='text' id='text'></textarea>

    this is js code

    var textArea = document.getElementById('text')
document.getElementById('name').addEventListener('keydown' , (e) => {
    textArea.value = e.target.value
})
document.getElementById('date').addEventListener('change' , (e) => {
    console.log(textArea.value + e.target.value);
    textArea.value = textArea.value + "" +e.target.value
})
    Login or Signup to reply.
  3. 0 
    function updateTextArea() {
  let name = document.getElementById("name").value;
  let date = document.getElementById("date").value;
  document.getElementById("text").value = "My name is " + name + " and the date is " + date;
}
    input,
textarea {
  width: 200px;
  margin-bottom: 10px;
}
    <input type='text' name='name' id='name' oninput="updateTextArea()"><br>
<input type='date' name='date' id='date' oninput="updateTextArea()"><br>
<textarea name='text' id='text'></textarea>
    Login or Signup to reply.
  4. 0

    Question is tagged [jquery] (regardless of need for this sample), so here you are

    $("input").on("input", () => {
  $("#text").text(`My name is "${$("#name").val().trim()}" and the date is "${$("#date").val().trim()}".`);
}).trigger("input");
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='text' name='name' id='name'><br/>
<input type='date' name='date' id='date'><br/>
<textarea cols=60 name='text' id='text'></textarea>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search