1

I have a textarea that I am trying to update using jQuery and I am finding that I get different results based on what browser I am using.

Have a look at this: https://jsfiddle.net/JBookham/mwaa6z2f/4/

I am using $('#txtArea').html("Example text"); to update the text that is shown. This works initially, until I try and type something in the textarea. After I do this in Chrome, .html() stops updating the value of the textarea. I have debugged through the JavaScript and can see that the innerHtml of the textarea is being updated, but not the value. I try to do the same thing in Edge and the innerHtml and the value get updated as expected.

My question is, does anyone know why this happens or knows of a way that I can get it working the same way between browsers?

Thanks

Update:
.val() does update the textarea the same way between browsers, but it doesn't provide the same functionality that I was looking for. However this answer had a way that I could use .val() and still be able to decode the text I was passing in, like so:
var decoded = $("<textarea/>").html("other text &amp;").val(); $('#txtArea').val(decoded);
It feels a bit hacky, like there should be a better way, but at least for the moment it's given me something that works the same way between browsers.

Community
  • 1
  • 1
JBookham
  • 21
  • 5

1 Answers1

2

You should use .val() to do this.

https://jsfiddle.net/mwaa6z2f/7/

Steveo
  • 557
  • 4
  • 15
  • The trouble I have with using .val() is that the text I am passing in could contain things like ", & etc. I pass those in to .html() and the text shown is exactly what I want, whereas if I use .val() it doesn't decode it for me. I have seen other solutions where I could use .val() and just replace the characters with what I actually want but it seems like a long winded way for something that works fine on one browser but not another. – JBookham May 10 '16 at 16:29