Question

我有一个应用程序会向后端发出多个异步调用;每个异步响应都是{date, string}值的数组。

我希望在我的网络浏览器的排序表中（按日期排序）显示每个异步调用到达时的响应。随着对其他异步调用的后续响应到来，我希望实时更新已排序的表。

例如，第一个异步响应可能是[{'2012-02-10', 'ABC'}, {'2012-01-19', 'DEF'}, {'2012-03-01', 'GHI'}]，我希望立即在浏览器中看到<table><tr><td>2012-01-19</td><td>DEF</td></tr><tr><td>2012-02-10</td><td>ABC</td></tr><tr><td>2012-03-01</td><td>GHI</td></tr></table>呈现的内容。

如果稍后出现[{'2011-12-09', 'JKL'}]的第二次异步响应，我希望将HTML更改为<table><tr><td>2011-12-09</td><td>JKL</td></tr><tr><td>2012-01-19</td><td>DEF</td></tr><tr><td>2012-02-10</td><td>ABC</td></tr><tr><td>2012-03-01</td><td>GHI</td></tr></table>

我之后的效果是在我的浏览器中有一个结果表，随着各种异步响应的出现，逐步更新已排序数据。当收到每个新的异步响应时，表格的大小会增加，因为新的{date, string}元素出现在正确的日期序列中，并且数据已经显示。

这可能不是一个独特的场景，因此我猜测有一种方法可以被认为是最佳实践＆＃39; - 可能使用jQuery UI。如果是这样，有人可以请我指出一个＆＃39; howto＆＃39;或者例子？ - 我还没能找到适合Google使用的任何东西。

提前致谢

Answer 1

你可以从这个

开始

<script>
function my_func()
{
var myarray = ["2012-02-10, ABC", "2012-01-19, DEF", "2012-03-01, GHI"];
var table_content = '';
var temp_arr = '';
for(var i in myarray)
{
    myarray.sort();
    temp_arr = myarray[i].split(',');
    table_content = table_content + '<tr><td>'+temp_arr[1]+'</td><td>'+temp_arr[0]+'</td></tr>'
}
table_content = '<table>'+table_content+'</table>'
document.getElementById('mytable').innerHTML = table_content;
}
</script>

<input type="button" value="clickme" onclick="my_func();"/>
<div id="mytable"></div>

代替在按钮上单击调用该功能，您可以在成功调用函数时运行该函数，然后填写html。

我希望这会有所帮助

在HTML表中对异步响应数据进行排序，更新和呈现

1 个答案: