CODEWITHSUNDEEP
javascript
Robert Munteanu
Robert Munteanu

Reputation: 68268

Textarea value update not reflect in page

I'm trying to update a textarea's value with Javascript. The code is similar to:

console.warn("Before set, value is " + document.getElementById('myTextArea').value);
document.getElementById('myTextArea').value = 'OMGWTFBBQ';
console.warn("After set, value is " + document.getElementById('myTextArea').value);

Although the Firefox and Chrome consoles show that the value property is updated, this is not reflected in the page itself.

The specific function is invoked from an onfocus handler of another element. The textarea itself is lazily initialised from the same method, by using:

var messageText = document.createElement('textarea');
messageText.id = 'myTextArea';
someParent.appendChild(messageText);

Obviously if I use the console rather than let the script run it does work.

Upvotes: 5

Views: 4902

Answers (1)

Martin Jespersen
Martin Jespersen

Reputation: 26183

Hmm after some testing, seems it should work like you want it to, so not sure why it doesn't, you can try to use the following instead though and see if it solves your problem:

console.warn("Before set, value is " + document.getElementById('myTextArea').value);
document.getElementById('myTextArea').firstChild.textContent = 'OMGWTFBBQ';
console.warn("After set, value is " + document.getElementById('myTextArea').value);

If this doesn't work for you either, then something about your page is very strange :)

Try something extremely simple like the following:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>

$(function(){
console.warn("Before set, value is " + document.getElementById('myTextArea').value);
document.getElementById('myTextArea').firstChild.textContent = 'OMGWTFBBQ';
console.warn("After set, value is " + document.getElementById('myTextArea').value);

});
</script>
</head>
<body>
<textarea id="myTextArea">hey</textarea>
</body>
</html>

if this works, then the browser is not at fault, and you need to find the problem in your code. If this doesn't work, you can blame the browser :)

Upvotes: 2

Related Questions