user3522121
user3522121

Reputation: 215

Displaying textarea content on click of button

I am having a text area and a button.Like this :

<textarea id="txtarea"></textarea>
<input type="button" value="add text" id="add" />

Now,what i want to do is that on click of the button that text to be displayed on the same page above this text area just like we do comment or answer a question on stackoverflow.

How this can be done ?Please help.

Upvotes: 0

Views: 13394

Answers (3)

Dejo Dekic
Dejo Dekic

Reputation: 2126

This will do if using Jquery (and previously text will stay) :

$('.button').click(function(){
var text = $('textarea').val();
if(text!=''){
$('p').text(text);
}
});

or like this:

$('.button').click(function(){
var text = $('textarea').val();
if(text!=''){
$('<p></p>').text(text).insertBefore('textarea');
}
});

Fiddle

Upvotes: 0

Jamie
Jamie

Reputation: 1094

As what you want, thus appending to the <div> division element, I assume that you will accept this answer (as a summary to all the comments and answers above) :

<!-- This is the HTML Part -->
<div id="text"></div>
<textarea id="new"></textarea>
<input type="button" onclick="appendTextToDiv();" />
<script>
    function appendTextToDiv(){document.getElementById("text").innerHTML = document.getElmentById("text").innerHTML + document.getElementById("new").value;}
</script>

This can let you simply append it to the text. Fiddle

Upvotes: 0

ashishmaurya
ashishmaurya

Reputation: 1196

you can do this using javascript
add any tag before (generally div or span tag is used) textarea tag

<div id="adduserdata"></div>
<textarea id="txtarea"></textarea>
<input type="button" value="add text" id="add" onclick="showtext()" />

Javascript code would be

function showtext(){
 var text = document.getElementById("txtarea");
 var showarea = document.getElementById("adduserdata");
 showarea.innerHTML=text.value;
}


here is working example

Upvotes: 1

Related Questions