jquery.post() and php

Question

I'm using $().post and php to change the contents of a <textarea>.

The script is succeeding - firebug clearly shows that the text in between the textarea tags has changed, and my little alert fires.

The user, however, doesn't see the changes. In Firefox the change doesn't occur at all, and in IE, the textarea updates up to 10 seconds late.

Here's the jquery I'm using:

$(document).ready(function() {
    $('#pv_list li:first').addClass('hilite');
    $("input[name='db_entries']:first").attr('checked', 'checked');
    $("input[name='db_entries']").click(function () {
        $.post("changeEntry.php", {post: $(this).val()}, function(data) { 
            $("textarea").text(data);alert('done');
        });
        $('#pv_list li').removeClass('hilite');
        $(this).parent().addClass('hilite');
    });
});

At first I thought it was because the page didn't validate, but it validates xhtml transitional.

The thing that's really bugging me is I had it working earlier and can't figure out what I changed.

Answer 1

Set .val() instead of .text()

Stackoverflow Archive:

• Set Value of Textarea in jQuery
• Insert text into textarea with jQuery
• How to retrieve the value of a textarea with Javascript
• Appending input-value to textarea-value

Answer 2

Have you tried using val() to set the value of the textarea instead of text()?

$.post("changeEntry.php",{post: $(this).val()},
      function(data) {
          $("textarea").val(data);
          alert('done');
});

Answer 3

Wouldn't it be easier to use the load() function?

$("input[name='db_entries']").click(function () {
    $("#outputarea").load("?", {"paramName":this.value});
});

Answer 4

I'm not sure, but one possibility is that you should do:

function(data){
  $("textarea").attr("value",data);
  alert('done');
}