{field: 'DataItemNum', title: '数据完整度', width: 100, formatter: function (v, r, i) {

 var p = (v / 27) * 100;

 var value = Math.ceil(p);

 var htmlstr = '<div class="easyui-progressbar progressbar easyui-fluid" style="width: 100%; height: 20px;">'

 + '<div class="progressbar-value" style="width: 100%; height: 20px; line-height: 20px;"> '

 + '<div class="progressbar-text" style="width: ' + value+'%'+ '; height: 20px; line-height: 20px;">' + value+ '%</div>'

 + '</div>'

 + '</div>';

 return htmlstr;

 }

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

渲染效果

easyui datagrid 单元格加进度条（亲测可用）的更多相关文章

  1. EasyUI Datagrid 单元格编辑

    3:对于单元格的编辑 $('#Units').datagrid({ pageNumber: 1, //url: "@ViewBag.Domain/Paper/GetQuestionUnit& ...

  2. DevExpress GridControl 单元格添加进度条(ProgressBar)

    首先可以使用DevExpress GridControl 自带的进度条控件. 但是我要用一个方法来设置所以的单元格进度,而不是每个单元格都要设置一遍,同时我想要根据进度值不同,进度条显示不同的颜色. ...

  3. EasyUI datagrid单元格文本超出显示省略号，鼠标移动到单元格显示文本

    nowrap : true;  是前提 $('#×××').datagrid({ nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取 }); 省略号样式: <sty ...

  4. easyui datagrid 单元格编辑（cell editing）

    demo中有row editing 项目中发现个cell editing,但是有bug,修改好了 主要实现功能:单击数据表格单元格,编辑单元格数据 js代码如下: $.extend($.fn.data ...

  5. easyui datagrid 单元格编辑 即见即所得,MVC菜单维护，扫描增加

    效果如图: 参见 EasyUI 官方 Demo 及文档 @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Lay ...

  6. easyui datagrid 单元格编辑 自动聚焦 、全选

    $.extend($.fn.datagrid.methods, { editCell: function (jq, param) { return jq.each(function () { var ...

  7. easyui datagrid 单元格 编辑时 事件 修改另一单元格

    //datagrid 列数据 $('#acc').datagrid({ columns : [ [ { field : 'fee_lend', title : '收费A', width : 100, ...

  8. easyui datagrid单元格实现溢出文本显示省略号的效果。

    Css .datagrid-btable .datagrid-cell{padding:6px 4px;overflow: hidden;text-overflow:ellipsis;white-sp ...

  9. 使用java实现AES算法的加解密（亲测可用）

    话不多说,直接上代码 import javax.crypto.Cipher;   import javax.crypto.spec.IvParameterSpec; import javax.cryp ...

随机推荐

  1. kafka和canal设置为开机启动

    1.切换到初始化目录 cd /etc/init.d/ 2.新建一个文件 如 touch autoupdate 3.vim autoupdate #!/bin/bash export JAVA_HOME ...

  2. redis主从、集群、哨兵

    redis的主从.集群.哨兵 参考: https://blog.csdn.net/robertohuang/article/details/70741575 https://blog.csdn.net ...

  3. 并发-ThreadLocal源码分析

    ThreadLocal源码分析 参考: http://www.cnblogs.com/dolphin0520/p/3920407.html https://www.cnblogs.com/coshah ...

  4. 并发-HashMap和HashTable源码分析

    HashMap和HashTable源码分析 参考: https://blog.csdn.net/luanlouis/article/details/41576373 http://www.cnblog ...

  5. 团体程序设计天梯赛 L2-018. 多项式A除以B（模拟）

    题意:给你A,B两个多项式,问你A/B的值:注意多项式给你的是每个式子的指数与系数:保留到一位小数,如果出现系数为0(保留后也是)的情况,请不要输出它,如果没有非系数为0的情况就输出特殊 题解:多项式 ...

  6. Hibernate -- Session的主键生成策略

    *缓存:集合--集合放置到内存中       *  只要session存在 session的一级缓存肯定存在.       *当执行查询时,以oid为oid=1条件到session的一级缓存中查找oi ...

  7. Ext.grid.GridPanel数据转json

    var count = docAdGrid.getStore().getCount(); var jsonArray = []; for (var i = 0; i < count; i++) ...

  8. Pandas日期功能

    日期功能扩展了时间序列,在财务数据分析中起主要作用.在处理日期数据的同时,我们经常会遇到以下情况 - 生成日期序列 将日期序列转换为不同的频率 创建一个日期范围 通过指定周期和频率,使用date.ra ...

  9. 四十六 Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)scrapy写入数据到elasticsearch中

    前面我们讲到的elasticsearch(搜索引擎)操作,如:增.删.改.查等操作都是用的elasticsearch的语言命令,就像sql命令一样,当然elasticsearch官方也提供了一个pyt ...

  10. C语言小知识点汇集

    1. 三元表达式“?:”冒号两边的两个操作数类型必须一致. 2. 枚举变量的sizeof值同int型一样为4. 3. 为了消除不必要的计算 &&两侧的表达式,当左侧即第1个表达式不成立 ...