CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Shojaeddin
Shojaeddin

Reputation: 121

show contents of textarea to a div

I want to make a textarea to show its content to a div by a clicking a button. I wrote a simple code that it sees for short time in div but it disappears in div and textarea quickly.

how can I correct it, for now I’m only designing the page and I want to make style for answer so I need to see content in div without connect it to server.

<textarea class="inBox"></textarea><button class="btn">Send</button>

Code link: jsfiddle

Upvotes: 1

Views: 124

Answers (6)

Francesco L.
Francesco L.

Reputation: 21

JQuery

$(document).ready(function(){
    $('.btn').on('click',function(e){
    e.preventDefault();
    var inpx= $('.inBox').val();
    $('#mainbox').append(inpx);
    });

});

Upvotes: 2

shubham jain
shubham jain

Reputation: 113

Use following code

HTML

<form action="#">
<textarea class="inBox"></textarea><button class="btn">Send</button>
</form>

JQuery

$(document).ready(function(){
$('.btn').on('click',function(){
var inpx= $('.inBox').val();
$('#mainbox').text(inpx);
});

});

Upvotes: 2

Vaibs_Cool
Vaibs_Cool

Reputation: 6156

Just Add 

e.preventDefault();

in the onClick button event

FiddleDemo

Upvotes: 2

Nikhil Batra
Nikhil Batra

Reputation: 3148

See the update fiddle:

added the following code in the click function:

 e.preventDefault();

To prevent the page reload/load.

"https://jsfiddle.net/h84qu8x3/12/"

Upvotes: 3

user3272018
user3272018

Reputation: 2419

Add return false; to the end of your method to prevent post action or change inputs type to button.

Your problem is in reload form by submit button click.

Upvotes: 2

A. Wolff
A. Wolff

Reputation: 74420

By default, type of button is submit, so that submits the FORM. Set its type to button:

<button type="button" class="btn">Send</button>

-jsFiddle-

Upvotes: 1

Related Questions