easyui datagrid 单元格加进度条(亲测可用)

Posted 天朝95

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui datagrid 单元格加进度条(亲测可用)相关的知识,希望对你有一定的参考价值。

 1 {field: \'DataItemNum\', title: \'数据完整度\', width: 100, formatter: function (v, r, i) {
 2 var p = (v / 27) * 100;
 3 var value = Math.ceil(p);
 4 var htmlstr = \'<div class="easyui-progressbar progressbar easyui-fluid" style="width: 100%; height: 20px;">\'
 5 + \'<div class="progressbar-value" style="width: 100%; height: 20px; line-height: 20px;"> \'
 6 + \'<div class="progressbar-text" style="width: \' + value+\'%\'+ \'; height: 20px; line-height: 20px;">\' + value+ \'%</div>\'
 7 + \'</div>\'
 8 + \'</div>\';
 9 return htmlstr;
10 
11 }

进度条长度这里要写成  xx%  格式

渲染效果

 

以上是关于easyui datagrid 单元格加进度条(亲测可用)的主要内容,如果未能解决你的问题,请参考以下文章

easyui在table单元格中添加进度条

jquery easyui datagrid一些注意事项

EasyUI DataGrid 编辑单元格

easyui datagrid 单元格关闭编辑框再开启编辑框就报错

怎么给easyui中的datagrid加水平滚动条

easyui前台改变datagrid某单元格的值