underline a part of text in Textarea

Question

is it possible to underline a portion of text in control.

I did like this in jquery, but no underline is appearing. any sample code examples?

<textarea rows = "3" cols = "50" id = "TestName" ></textarea>

Jquery

 var dvHTML = ''
 dvHTML = '<span style=text-decoration: underline;>' + "Hello world" + '</span>';
$("#TestName").html(dvHTML);

Output i'm getting as only Hello world, tags are not getting recognized

Solution 1

You can use a contenteditable div.

<div contenteditable="true">I am saying <span>Hello</span></div>

Working Fiddle

Solution 2

You can't do that on textarea, You'll need some WYSIWYG if you need style on it. Or you can fake user by adding div above of the textarea, and hide the textarea it self.

Comments

[Naruto]

Thanks, are there any sample example?

[Naruto]

If so, then how does sharepoint people picker control works?, how they have implemented that, it does underlining when it recognizes contact

[BeNdErR]

this will underline everything inside the textarea

[Naruto]

I want a specific portion of the line to be underlined,

[Naruto]

in this case, if my text size is more then div size then it will come out of the border right?, if i hit enter it wont expand like text area na>

[xdazz]

@LLL You could do some css trick to deal with this, check the demo again i updated it.

[Nathan B]

@Iqbal Fauzi, how can we create the div about the textarea? Is there such an example somewhere?