Copy value from one Textarea to another automatically

Question

Copy value from one Textarea to another automatically

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I saw this post ( How to get the value of one input and assign to another? ) but I could not adapt to textarea .

I have the following HTML, which I want to pass the value of the first textarea to the second:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

    <div class="container" style="margin-top:100px">

             <div class="row">
            <div class="col-md-6">
              <div class="form-group">
    <label for="textoOriginal">Insira seu Texto</label>
    <textarea class="form-control" id="texto" class="texto" rows="3"></textarea>
  </div>
            </div>
            <div class="col-md-6">
              <label for="textoConvertido">Insira seu Texto</label>
    <textarea class="form-control" id="convertido1" name="convertido1" rows="3"></textarea>
            </div>
      	</div>

    </div>

javascript jquery

asked by anonymous 21.11.2017 / 14:48

2 answers

0

You can do this using jquery

$('#one').on('keyup', function(){
  var valor = $(this).val()
  $('#two').val(valor)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><textareaid="one"></textarea>
<textarea id="two"></textarea>

Or you can do this using just javascript

let one = document.getElementById('one')
let two = document.getElementById('two')

one.onkeyup = function(){
  let valor = one.value
  two.value = valor
}

<textarea id="one"></textarea>
<textarea id="two"></textarea>

Of course, there are several ways to do this, with click and so on. Use as needed.

21.11.2017 / 15:01

Renaming file: 'str' object has no attribute 'group' [closed] Calculate a string in Python

score 0 · Accepted Answer

Using jQuery, just do it like this:

$(function () {

    $('#texto').on('input', function () {
         $('#convertido1').val(this.value);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="container" style="margin-top:100px">

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="textoOriginal">Insira seu Texto</label>
                <textarea class="form-control" id="texto" class="texto" rows="3"></textarea>
            </div>
        </div>
        <div class="col-md-6">
            <label for="textoConvertido">Insira seu Texto</label>
            <textarea class="form-control" id="convertido1" name="convertido1" rows="3"></textarea>
        </div>
    </div>

</div>