JQuery val() does not work for textarea in Opera

Question

I am displaying a modal dialog using jQuery. This dialog has a textarea control on it. But on submitting this dialog, the value of this textarea is not recognized by jQyery for some reason. It always comes blank. This works perfectly in other browsers. I put alert to display the value but it looks blank. Can anybody help me in this regards?

Controls

<input type="text" id="txtGroupName"/>
<textarea rows="3" cols="30" id="txtDescription"></textarea>

jQuery code which used this value

var postData = new Object();
postData.GroupName = $('#txtGroupName').val();
postData.Description = $('#txtDescription').val();

$('#txtDescription').val() comes blank but $('#txtGroupName').val() is read correctly as it is a input field.

One more finding about this issue:

When I put alert in my update function after populating the control value on page load, this alert displays the existing value properly. But it displays only existing value. It does not display the edited value after submitting the modal box.

Answer 1

Have you tried .attr("text") or .attr("value")? I'm unable to test this but this would seem logical to me.

If it doesn't then let me know and I'll remove this answer.

Answer 2

Textarea don't have value attribute. Try to use $('#txtDescription').text();

Answer 3

I've found, in Chrome 6.0.472.59, Firefox 3.6.9 and Opera 10.62, all on Ubuntu 10.04, that textarea does have/use the .val() attribute. On the off-chance that some other browsers don't, or might not, I put together this jsbin demo. I used an if/else block to cover both approaches, though. Just in case...

$(document).ready(
  function() {
  $('form').submit(
    function() {

      if ($('textarea').val()) {
        var means = 'val()',
        textValue = $('textarea').val();
      }
      else {
        var means = 'text()',
        textValue = $('textarea').text();
      }

      alert('(' + means + ') ' + textValue);

      return false;
    }
    );
  }
  );

This Stackoverflow question (jQuery get textarea text) also suggests that it should be possible and reliable, as does the first commenter on the API page for Val(), at jQuery.com.

Note, as regards Opera: the jsBin demo only worked once I'd deactivated the developer tools (for whatever reason). It might be worth turning off Dragonfly (if it's running), and then refreshing the demo page (or, obviously, your own test page) to see if it makes a difference. Either way, it's always worth clearing your cache to make sure the most up-to-date version of the files are being used.

Answer 4

I have the same problem. I do not seem to find out a solution yet :(

Edit:

in opera for getting the value or a textarea works only:

document.getElementById("description").value;

strange is that $("textara#description").val("") works (set method)

Answer 5

Hi Anil, you may have come across a very obscure bug referred to in a blog post on the Opera sitepatching blog 1 as "PATCH-287, Hack to make script see typed value in TEXTAREA on blog.ebuddy.com. Opera fails to read correct value from a previously hidden textarea".

I'm a little bit reluctant to recomment workarounds without seeing the full code though.

Answer 6

Hello guys.

val() and text() in jquery works correctly, but after setting value of textarea you need to rerender textarea, you can do this setting css property in such way

if ($.browser.opera)
    $('textarea').val(someText).css({display:block});
else
    $('textarea').val(someText);

Hello from Russia. Sorry for my english =)