jQuery MiniUI

标题: 关于datagrid 分组后setData的问题 [打印本页]

作者: binyazi 时间: 2013-10-28 20:46:06 标题: 关于datagrid 分组后setData的问题

本帖最后由 binyazi 于 2013-10-29 12:33 编辑

hi,发现一个问题,如下
我有一个表格,按某列分组后,每隔2秒从数据库中查询数据,调用setData方法更新数据,然后和上一次的数据逐行按列比较,若数据不同,则在此单元格用渐变的高亮展示(jquery的动画,用一个插件highlightFade.js实现).在3.2之前,这个高亮渐变效果是没有问题的,但是3.2不行,没有最后这个渐变效果了,我调试了一下,如果我不分组,没有问题.部分代码如下:
//2-更新列表数据
  $.getJSON("${ctx}/tc/online/list",function(newData){
datagrid.setData(newData);
if(LAST_GRID_DATAS.length>0){
for(var i=0;i<newData.length;i++){
   var oldrow=LAST_GRID_DATAS,newrow=newData;
   if(oldrow && oldrow.tc_id==newrow.tc_id) { //虽然新旧数据集应该相同,但还是要检查一下
   if(newrow.record_time != oldrow.record_time)
   $("#record_time_"+newrow.tc_id).parent().highlightFade({color:'red',speed:500,iterator:'sinusoidal'});
   if(newrow.height != oldrow.height)
   $("#height_"+newrow.tc_id).parent().parent().highlightFade({color:'blue',speed:500,iterator:'sinusoidal'});
   if(newrow.weight != oldrow.weight)
   $("#weight_"+newrow.tc_id).parent().parent().highlightFade({color:'gray',speed:500,iterator:'sinusoidal'});
   if(newrow.range_value != oldrow.range_value)
   $("#range_value_"+newrow.tc_id).parent().parent().highlightFade({color:'black',speed:500,iterator:'sinusoidal'});
   //$("#range_value_"+newrow.tc_id).parent().parent().slideUp("slow");
   if(newrow.round_value != oldrow.round_value)
   $("#round_value_"+newrow.tc_id).parent().parent().highlightFade({color:'maroon',speed:500,iterator:'sinusoidal'});
   if(newrow.wind != oldrow.wind)
   $("#wind_"+newrow.tc_id).parent().parent().highlightFade({color:'orange',speed:500,iterator:'sinusoidal'});
   if(newrow.angle != oldrow.angle)
   $("#angle_"+newrow.tc_id).parent().parent().highlightFade({color:'aqua',speed:500,iterator:'sinusoidal'});
   if(newrow.torque != oldrow.torque)
   $("#torque_"+newrow.tc_id).parent().parent().highlightFade({color:'green',speed:500,iterator:'sinusoidal'});
   if(newrow.load_rate != oldrow.load_rate)
   $("#load_rate_"+newrow.tc_id).parent().parent().highlightFade({color:'silver',speed:500,iterator:'sinusoidal'});
   }
}
}
LAST_GRID_DATAS=newData;
  });
  setTimeout(arguments.callee,DATA_UPDATA_DELAY);
},1000);
补充附件[attach]3097[/attach],demo.rar,解压后,有两个html,demo3.1.html,引用miniui3.1,demo3.2.html引用miniui3.2

作者: factory 时间: 2013-10-29 09:46:25

这类的问题最好提供一个能重现问题的HTML例子
数据用几条静态的来setData(),因为你这样说的太笼统,我们没法重现问题,就不好解决问题

作者: binyazi 时间: 2013-10-29 12:35:08

你好,版主,我已做了一个demo,你可以看一下,在主贴的最后我补充了一个demo.rar

作者: factory 时间: 2013-10-29 14:50:44

binyazi 发表于 2013-10-29 12:35
你好,版主,我已做了一个demo,你可以看一下,在主贴的最后我补充了一个demo.rar

[attach]3099[/attach]

你这样写

作者: binyazi 时间: 2013-10-29 15:57:40

嗯,看到了.谢谢,但可以告诉我,为什么一定要这样,不能用setTimeout吗?

作者: factory 时间: 2013-10-29 17:07:41

binyazi 发表于 2013-10-29 15:57
嗯,看到了.谢谢,但可以告诉我,为什么一定要这样,不能用setTimeout吗?

你这个做法是在不断刷新整个页面还是表格了,然后就导致了一些渲染上的问题

这样做法本来就是不可取的,万一你表格或者页面很复杂呢?你不停得刷,很让人崩溃的

作者: binyazi 时间: 2013-10-29 18:51:26

啊,泪奔呀,我刚才仔细看了一下你给我的解决方法,你改变了我的初衷,你看一下我主贴附件中的demo3.2.html,在setTimeOut的执行函数中有一个datagrid.setData(newData);如果去掉了,就可以的.但这不是我想要的.
有这么一个业务场景:有一个表格要显示某些实时数据,也就是说每隔一段时间就要去数据库查询新的数据显示出来.所以一般就用setTimeOut定时来做.现在的问题是,在3.2版本以前我demo中的写法都没有问题,3.2有问题呀

作者: factory 时间: 2013-10-30 09:32:35

binyazi 发表于 2013-10-29 18:51
啊,泪奔呀,我刚才仔细看了一下你给我的解决方法,你改变了我的初衷,你看一下我主贴附件中的demo3.2.html,在s ...

恩,我们看下

作者: factory 时间: 2013-10-30 10:36:26

binyazi 发表于 2013-10-29 18:51
啊,泪奔呀,我刚才仔细看了一下你给我的解决方法,你改变了我的初衷,你看一下我主贴附件中的demo3.2.html,在s ...

[attach]3109[/attach]

作者: binyazi 时间: 2013-10-31 13:36:16

这个回答解决问题了,谢谢,再问一下,为什么会这样,我之前的写法为什么在低版本中可以,在此版本中不行?是因为grid实现中有clearTimeout吗?

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)