使用jquery和ajax更新表中的数据

我试图根据ajax响应更新表。 我的更新应该作为我表中

内的第一行插入。 随着我的编码，当我在加载页面后插入数据时，这会发生在我的表中。 我的问题是当我再次插入数据而没有刷新它插入到表中的页面作为

第二行并再次插入另一行作为第三行，依此类推。

但是当我刷新或重新加载页面时，我的表格会以正确的顺序调整数据。 谁能告诉我如何解决这个问题？

到目前为止这是我的代码：

 $.ajax({ type: "POST", // HTTP method POST or GET url: "process.php", //Where to make Ajax calls //dataType:"text", // Data type, HTML, json etc. dataType: 'html', data: { name: $('#name').val(), address: $('#address').val(), city: $('#city').val() }, success: function(data) { $('#manage_user table > tbody:first').append(data); //alert(data); }, error: function(xhr, ajaxOptions, thrownError) { //On error, we alert user alert(thrownError); }, complete: function() { //alert('update success'); } }); 

更新：这是我的表的HTML

  // -------- this is the place I need to insert data 
 
 
 Name
 
Address
 
City
 
Edit
 
Delete
 
 
 
  sdfsdfs
 
dsfs
 
dsfdsf
 
 
 
 
 
  aaaaaaa
 
dfsdf
 
dsfsf
 
 
 
 
  

Answer 1

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

试试这个。 检查我的小提琴： http ： //jsfiddle.net/W4gYY/3/

如果你宣布thead然后你可以使用tbody:first并且工作正常。 你没有提到将html视为默认tbody

如果您的HTML如下所示：

 
 
 
 
 
 Name
 
Address
 
City
 
Edit
 
Delete
 
 
 
 
 
  sdfsdfs
 
dsfs
 
dsfdsf
 
 
 
 
 
  aaaaaaa
 
dfsdf
 
dsfsf
 
 
 
 
 
  

那你可以用

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

否则在html中你没有你必须做以下代码

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

Answer 2

使用html而不是append

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

Answer 3

这是因为你追加数据，你应该使用.html（数据），然后它将被你的新数据所取代

Answer 4

这里是你的解决方案

老：

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

新：

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

您需要在附加位置使用前置

Answer 5

有一个名为after（）的jQuery方法，它可以做你想要的事情……

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

可以改为

$('#manage_user tr:first').after('

first

'); 将结果作为表的第一行插入…在此处查看演示