Copy value from one Textarea to another automatically

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>
    
asked by anonymous 21.11.2017 / 14:48

2 answers

0

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>
    
21.11.2017 / 15:00
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