Update Data In A Table With Jquery And Ajax

I am trying to update a table according to ajax respond. My update should be insert as the first row inside in my table. With my coding this is happening in my table

Solution 1:

$('#manage_user table > tbody:last').find('tr:first').before(data);

Try this. check my fiddle : http://jsfiddle.net/W4gYY/3/

If you declared thead then you can use tbody:first and working fine. You do not mention thead that is way html treated as default tbody

If your html look like below :

<divid="manage_user"><table><thead><tr><th><inputtype='checkbox'class='selectAll'name='selectAll'value='' /> Name</th><th>Address</th><th>City</th><th>Edit</th><th>Delete</th></tr></thead><tbody><tr><td><inputtype='checkbox'name=''value=''class='' />&nbsp;&nbsp;sdfsdfs</td><td>dsfs</td><td>dsfdsf</td><td><spanclass='edit_ico'></span></td><td><spanclass='delete_ico'></span></td></tr><tr><td><inputtype='checkbox'name=''value=''class='' />&nbsp;&nbsp;aaaaaaa</td><td>dfsdf</td><td>dsfsf</td><td><spanclass='edit_ico'></span></td><td><spanclass='delete_ico'></span></td></tr></tbody></table></div>

then you can use

$('#manage_user table > tbody:first').find('tr:first').before(data);

otherwise without thead in html you have to do following code

$('#manage_user table > tbody:last').find('tr:first').before(data); 

Solution 2:

use html instead of append

success: function(data) {
        $('#manage_user table > tbody:first').html(data);
        //alert(data);
}

Solution 3:

It is because your appending the data, you should use .html(data) then it will be replaced by your new data

Solution 4:

here the solution for you

OLD :

$('#manage_user table > tbody:first').append(data);

NEW :

$('#manage_user table > tbody').prepend(data);

You need to use prepend at the place of append

Solution 5:

There is a jQuery method called after() and it can do the thing you want...

$('#manage_user table > tbody:first').append(data); 

can be changed to

$('#manage_user tr:first').after('<tr><td>first</td></tr>'); which inserts the result as first row of the table... Check the demo here