CODEWITHSUNDEEP
javascript
RMsplace
RMsplace

Reputation: 53

Getting the value of textarea inside form

I want to get the value of this textarea inside form and copy the the value to another textarea outside form using javascript. How should I do that? here's my textarea...

<form>
    <textarea id="tpName" name="tpName" onchange="tpName(this)" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
</form>

<textarea id="copytpName" name="copytpName" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>

Whenever I type a value in textarea inside form, I also want to update the value of textarea outside form.

Upvotes: 0

Views: 504

Answers (4)

j08691
j08691

Reputation: 207891

There's no need for jQuery as some others have posted in their answer. Simply don't name your function the same thing you use for IDs and form names and it works:

jsFiddle example

<form>
    <textarea id="ttpName" name="ttpName" onchange="tpName(this)" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
</form>
<textarea id="copytpName" name="copytpName" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
function tpName(data) {
    document.getElementById("copytpName").value = data.value;
}

I changed your textarea to <textarea id="ttpName" name="ttpName" ...

Upvotes: 1

Ashis Kumar
Ashis Kumar

Reputation: 6544

You could do like this in javascript,

HTML

<form>
<textarea id="tpName" name="tpName" onkeyup="copyThis(this);" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
</form>

<textarea id="copytpName" name="copytpName" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>

JAVASCRIPT

function copyThis(txObj) {
    document.getElementById("copytpName").value = txObj.value;   
}

Note: You need to change the function name. The function name matches with the textarea name, so its creating the issue in your case.

Try this http://jsfiddle.net/CZCnx/2/

Upvotes: 1

Farhan
Farhan

Reputation: 752

I have added the code here, it uses jquery

http://jsfiddle.net/5B6KC/1/

CODE:

$("#tpName").keyup(function(){
    $("#copytpName").val($(this).val());
})

Upvotes: 0

Igl3
Igl3

Reputation: 5108

I would try this:

var text = document.getElementById("tpName").value;

$("#copytpName").attr("value", text);

Upvotes: 0

Related Questions