查看: 7184|回复: 12

【datagrid颜色问题】 [复制链接]

wendys1127

中级会员

Rank: 3 Rank: 3

电梯直达

楼主

发表于 2015-11-10 16:42:17 |只看该作者 |倒序浏览

是这样
------------------------------------------
datagrid读取Excel文件后，在点击保存的时候，数据验证，
验证这里我是不通过的数据行，通过addRowCls添加红色背景样式。

问题在于：
我现在是有1000多条数据导入，然后数据验证拦截 318条未通过，然后颜色变红，然后我在浏览datagrid上下查看时，
点击，所有红色都不见了？？是不是数据量过大，导致渲染没了吗？？就是我拖动滚动条时，颜色没了

收藏0

dforce

超级版主

Rank: 8 Rank: 8

沙发

发表于 2015-11-10 16:51:05 |只看该作者

请提供重现页面

wendys1127

中级会员

Rank: 3 Rank: 3

板凳

发表于 2015-11-10 17:26:17 |只看该作者

dforce 发表于 2015-11-10 16:51
请提供重现页面

-----临时弄得一个demo
-------------------------------------------------
CSS:
.color{
background-color:#f3b198;
}

--Html
<div id="datagrid">
  <div property=columns>
   <div field="user" header="姓名"></div>
   <div field="age" header="年龄"></div>
  </div>
</div>

-------------------------
脚本部分
<script>
mini.parse();
var grid=mini.get("datagrid");

function ChangeColor(){
for(var int i=0,i<1200;i++){
  grid.addRow({
user:'姓名'+i,
age:'20'
});
}
}

var data=grid.getData();
for(var i=0;i<data.length;i++){
grid.addRowCls(data,"color");
}

</script>

以上示例

dforce

超级版主

Rank: 8 Rank: 8

地板

发表于 2015-11-10 17:45:36 |只看该作者

wendys1127 发表于 2015-11-10 17:26
-----临时弄得一个demo
-------------------------------------------------
CSS:

你这样的操作效率很差
数据量大需要虚拟滚动，虚拟滚动渲染样式不能通过addRowCls来实现
建议用drawcell来处理

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="../../scripts/boot.js" type="text/javascript"></script>
<style>
.color
{
background-color: #f3b198;
}
</style>
</head>
<body>
<div id="datagrid" style="width: 500px; height: 300px" class="mini-datagrid"
virtualScroll="true"
>
<div property="columns">
<div field="user" header="姓名">
</div>
<div field="age" header="年龄">
</div>
</div>
</div>
<script type="text/javascript">
mini.parse();
var grid = mini.get("datagrid");
function ChangeColor() {
var rows = [];
for (var i = 0; i < 1000; i++) {
var row={
user: '姓名' + i,
age: '20'
};
rows.push(row);
}
grid.setData(rows);
}
ChangeColor();
grid.on("drawcell", function (e) {
e.rowCls = "color";
})
</script>
</body>
</html>

复制代码

wendys1127

中级会员

Rank: 3 Rank: 3

5^#

发表于 2015-11-11 09:26:38 |只看该作者

本帖最后由 wendys1127 于 2015-11-11 09:30 编辑

dforce 发表于 2015-11-10 17:45
你这样的操作效率很差
数据量大需要虚拟滚动，虚拟滚动渲染样式不能通过addRowCls来实现
建议用drawcell ...

实际开发中，是加载Excel读取后放到datagrid，然后点击保存进行验证，不通过变色处理，，，还涉及行之间某些数据组合验证，，，ondrawcell好像仅仅在加载后重绘，以及行行直接的验证在重绘可以做到吗。。。，可以反复重绘吗？

felt

超级版主

Rank: 8 Rank: 8

6^#

发表于 2015-11-11 09:43:26 |只看该作者

wendys1127 发表于 2015-11-11 09:26
实际开发中，是加载Excel读取后放到datagrid，然后点击保存进行验证，不通过变色处理，，，还涉及行之间 ...

drawcell数据改变都会触发

wendys1127

中级会员

Rank: 3 Rank: 3

7^#

发表于 2015-11-11 10:28:55 |只看该作者

本帖最后由 wendys1127 于 2015-11-11 10:30 编辑

felt 发表于 2015-11-11 09:43
drawcell数据改变都会触发

那行与行之间还是得遍历，然后想上面贴的示例一样改变颜色，，，然后即使是虚拟滚动，当你拖动快的时候明显 datagrid显示跟不上速度，直接空白.......然后背景颜色还是清了成默认了

wendys1127

中级会员

Rank: 3 Rank: 3

8^#

发表于 2015-11-11 11:14:13 |只看该作者

felt 发表于 2015-11-11 09:43
drawcell数据改变都会触发

在前端查看，动态生成的tr上有验证类，说明有颜色变化，当我拖动虚拟滚动条时，很明显，背景色的样式类消失了，也难怪没颜色了

wendys1127

中级会员

Rank: 3 Rank: 3

9^#

发表于 2015-11-11 11:45:00 |只看该作者

felt 发表于 2015-11-11 09:43
drawcell数据改变都会触发

要不然，怎么实现再加上复选框，这样即使颜色没了，还勾上，
-----------------------
现在是 grid.deselectAll(true) 取消所有勾选。
然后验证的时候，假如行验证不通过就 grid.addrowCls(row,"color") grid.setSelected(row)

好像还有点问题

felt

超级版主

Rank: 8 Rank: 8

10^#

发表于 2015-11-11 12:23:03 |只看该作者

wendys1127 发表于 2015-11-11 11:45
要不然，怎么实现再加上复选框，这样即使颜色没了，还勾上，
-----------------------
现在是 grid.desel ...

那么多行，请不要使用addRowCls

12 下一页

返回列表

		自动登录	找回密码
密码			立即注册