【easyui】datagrid中增加进度条

最新推荐文章于 2024-08-01 20:11:30 发布

小魏的马仔

最新推荐文章于 2024-08-01 20:11:30 发布

阅读量4k

点赞数

分类专栏： web开发文章标签：函数 datagrid easyui

本文链接：https://blog.csdn.net/xuexiiphone/article/details/53706877

版权

web开发专栏收录该内容

48 篇文章 1 订阅

订阅专栏

1 增加formater函数

                {
                    field: 'pct',
                    title: '完成比例',
                    width: 100,
                    align: 'center',
                    sortable: false,
                    formatter: showProcessBar
                }

2 函数实现

//增加进度条显示功能
        function showProcessBar(value, row, index) {        
            var htmlstr = null;
            //如果NaN，则说明未分配计划
            if(isNaN(parseInt(value))){
                console.log("NaN");
                htmlstr = '<div class="progressbar-text" style="width:90px;">' 
                    + "未分配计划" + '</div><div class="progressbar-value" style="width:0px">&nbsp </div>';
            }else if(parseInt(value) > 100 || value.indexOf(",") > 0){//大于100，统一按照100%统计，//超过1000
                console.log("大于100 value = "+value+" parseIntValue = "+ parseInt(value));
                htmlstr = '<div class="progressbar-text" style="width:90px;">' 
                    + value + '</div><div class="progressbar-value" style="width:90px">&nbsp </div>';
            }else{//完成比例正常显示
                console.log("小于100 value = "+value+" parseIntValue = "+ parseInt(value));
                htmlstr = '<div class="progressbar-text" style="width:90px;">' 
                    + value + '</div><div class="progressbar-value" style="width:'+
                    parseInt(value)+'px">&nbsp </div>';
            }
            return htmlstr;
        }