Can i post to a table in jquery?

[JohnOP]

I have a message system where users can send each other messages, i am trying to make it that after they send the message the table that holds the messages updates itself without page refresh, the problem i am having is that normally i would update a div with the posted message from a callback php page but with using a table instead of the div its confusing me.

 

Showing the messages

<?php
while($row = mysql_fetch_assoc($q)){

$sender = $row['sender_username'];
$subject = $row['subject'];
$date = $row['date'];
$time = $row['time'];
$open = $row['open'];
$message = $row['message'];
?>
<img src="pic.jpg" height="80" width="80" style="float: left; padding: 10px;">
<br />
<table  style="table-layout: fixed; width: 85%; color: #416280;">
<tr><td width="87%">
<?php echo $sender; ?></b></td><td><font size="2"><?php echo $date, $time; ?></td>


</tr>
<tr><td>
<font color="#000000;" size="3"> 
<?php echo $message; ?>
</td></tr>


</table>
<hr style="width: 100%; height: 1px; border: none; background-color: #A4A4A4;">

<?php
}

 

 

Form

// viewmessage is the current page
<form action="viewmessage.php?id=<?php echo $id; ?>&subject=<?php echo $subject; ?>" method="POST" id="message">
<textarea style="border: 1px solid #A4A4A4; width: 650px;" cols="100" rows="7" name="message"></textarea>
<br /><br />
<input id="buton-input" type="submit" name="send" value="Send Message" style="font-size: 12px; color: #fff; font-weight: bold; margin-top: -10px; height: 30px; width: 110px; border: 1px solid #334E66; background: #489DCE;">
</form>

 

 

Jquery to post the data

$(function() { // wait for the DOM to be ready
    $('#message').submit(function() { // bind function to submit event of form
        $.ajax({
            type: $(this).attr('method'), // get type of request from 'method'
            url: $(this).attr('action'), // get url of request from 'action'
            data: $(this).serialize(), // serialize the form's data
            success: function(responseText) {
              
                $('#messagesent').html(responseText);
            }
        });
        return false; // important: prevent the form from submitting
    });
})

 

What i want is when the user sends a new message the table will update in the same fashion as the older messages by means of the sender name being in the first td etc.

[darkfreaks]

http://www.9lessons.info/2011/03/live-table-edit-with-jquery-and-ajax.html