CODEWITHSUNDEEP
javascriptjquery
Dean Jason
Dean Jason

Reputation: 105

using text() to change certain character in textarea

<input id='myTextbox1' type='text'/>
<br><br>
<textarea>Hello my name is James</textarea>

$('#myTextbox1').on('input', function() {
    $('textarea').text($(this).val());
});

I want to change the word 'James' by binding it to my input field. So far I'm stuck, only able to change the entire textarea. I know I can do it using div, but how about textarea?

Upvotes: 1

Views: 95

Answers (2)

Giau Nguyen
Giau Nguyen

Reputation: 41

Another way for your case, this way needs some hard code for things to go on the right way.

[Fiddle][http://jsfiddle.net/giaumn/2dahonz3/1/]

Upvotes: 0

Downgoat
Downgoat

Reputation: 14361

Doing this kind of manipulation is recommended with a contentEditable div

$('#myTextbox1').on('input', function() {
    $('#name').html($(this).val());
});
div[contenteditable] {
  resize: both;
  border: 1px solid gray;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id='myTextbox1' type='text'/>
<br><br>
<div contenteditable=true>Hello my name is <span id="name">James</span></div>

This possible but the best way would be to specify the format to avoid complex string manipulation.

var format = "Hi, My name is ";
$('input').on('input',function () {
  $('textarea').val(format + $(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input value="James"><br/>
<textarea>Hi, My name is James</textarea>

Upvotes: 1

Related Questions