我有一个由表组成的jquery移动应用程序。 该表包含时间字段和一些数字字段。 他们的统计数据是静态的,因为不会改变,我可以按名称或数字过滤表格。检查这个Fiddle
然后我决定增加此更新的Fiddle中显示的表值。
更新值的代码
function UpdateFunction(){
$(".updateMeInt").each(function(index){
var cur = parseInt($(this).text(), 10);
$(this).text(cur + 1);
});
$(".updateMeTime").each(function(index){
var cur = $(this).text().split(":");
var sec = parseInt(cur[1], 10);
var min = parseInt(cur[0], 10);
sec = sec + 3;
if (sec >= 60){
sec = 0
min = min + 1;
}
$(this).text(pad(min) + ":" + pad(sec));
});
}
function pad(num) {
var s = "0" + num;
return s.substr(s.length-2);
}
但问题是现在我无法过滤更新的值。
有人可以就这是为什么以及如何解决这个问题提出建议吗?
答案 0 :(得分:1)
您需要更新dataTable
以及html
。
例如,修改你的函数来更新整数单元格:
$(".updateMeInt").each(function(index)
{
var cur = 1+ parseInt($(this).text(), 10);
var oTable = $('#example').dataTable();
oTable.fnUpdate(cur, $(this).parent('tr')[0], $(this).index());
});
在上面,fnUpdate
(see docos)正在传递新的单元格值,父tr
- 元素和单元索引。
但是现在您可能会注意到,一旦过滤内容,只有可见行会继续更新。您可能计划从ajax
电话或其他内容获取动态数据;在这种情况下,您最好在更新时完全销毁旧的dataTable
。
尽管如此,根据您当前的示例,以下UpdateFunction()
还应更新隐藏在dataTable
中的过滤行:
function UpdateFunction()
{
var oTable = $('#example').dataTable();
var nNodes = oTable.fnGetNodes();
$.each(nNodes, function(index,node)
{
$(node).children(".updateMeInt").each(function(index)
{
var cur = 1+ parseInt($(this).text(), 10);
oTable.fnUpdate(cur,node,$(this).index());
});
$(node).children(".updateMeTime").each(function(index)
{
var cur = $(this).text().split(":");
var sec = 3+ parseInt(cur[1], 10);
var min = parseInt(cur[0], 10);
if (sec >= 60)
{
min+=1;
sec%=60;
}
var newval=pad(min) + ":" + pad(sec);
oTable.fnUpdate(newval,node,$(this).index());
});
});
}
Here it is在jsfiddle中。