[英]Updating a table of data with ajax/JQuery
I am trying to update a table using data from ajax/json. 我正在尝试使用ajax / json中的数据更新表。
Here is JQuery Code: Updated to use functions for simpler execution. 这是JQuery代码: 更新为使用函数来简化执行。
$(document).ready(function() {
//var userid = $( ".migrating" ).data( "userid" );
function ajaxUpdate(userid){
window.setInterval(function(){
$.ajax({
url: "info.php?userid=" + userid + "",
async: true,
type: "POST",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(results) {
$("#uid" + userid).html(results.uid);
$("#moved" + userid).html(results.moved);
$("#percentmoved" + userid).html(results.percentmoved);
$("#avgspeed" + userid).html(results.avgspeed);
$("#eta" + userid).html(results.eta);
}
});
}, 3000);
}
ajaxUpdate($(".migrating").data("userid"));
});
HTML Code: HTML代码:
<table>
<tr>
<td><b>ID</b></td>
<td><b>Moved</b></td>
<td><b>Moved %</b></td>
<td><b>Avg Speed</b></td>
<td><b>ETA</b></td>
</tr>
<tr class="migrating" data-userid="101">
<td><div id="uid101">Loading...</div></td>
<td><div id="moved101">Loading...</div></td>
<td><div id="percentmoved101">Loading...</div></td>
<td><div id="avgspeed101">Loading...</div></td>
<td><div id="eta101">Loading...</div></td>
</tr>
<tr class="migrating" data-userid="102">
<td><div id="uid102">Loading...</div></td>
<td><div id="moved102">Loading...</div></td>
<td><div id="percentmoved102">Loading...</div></td>
<td><div id="avgspeed102">Loading...</div></td>
<td><div id="eta102">Loading...</div></td>
</tr>
</table>
i want to issue "ajaxUpdate()" on each instance of class="migrating" from the tables. 我想在表中每个class =“ migrating”实例上发出“ ajaxUpdate()”。
My info.php file simply outputs random strings and the the userid from the post string, the only problem is i need todo this for each of the fields. 我的info.php文件只是输出随机字符串和发布字符串中的userid,唯一的问题是我需要为每个字段执行此操作。
I'm assuming the cause of the problem is having multiple class="migration" fields. 我假设问题的原因是有多个class =“ migration”字段。
I've tried searching but couldn't find anything specific to multiple rows. 我尝试搜索,但找不到特定于多行的任何内容。
You can user jQuery.each to loop through the results. 您可以使用jQuery.each遍历结果。 Something similar to this: 类似于以下内容:
success: function(results) {
$.each(results, function(index) {
// your logic goes here.
})
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.