统计easyui datagrid某列之和显示在对应列下面

时间:2023-02-23 08:46:42

项目需求要在表格下面加一行统计求和的,结果网上搜寻了一堆,要么说的不详细,高深大牛们的见解;要么实现不了,搜寻老半天修改出一个可以用的,做一下学习记录,新手菜鸟,欢迎指正和新解决方案。

最终效果图:

统计easyui datagrid某列之和显示在对应列下面

JS代码

editcount = 0;
var objTable=$("#personManage");
objTable.datagrid({ pagination: true,
pagePosition:'bottom',
onLoadSuccess: compute,//加载完毕后执行计算
fitColumns:false,
enableHeaderClickMenu:false,
singleSelect:false,
autoRowHeight:true,
nowrap:true,
url:'${ctx}/cpv3QuotationCtrl/costGather?RndId='+Math.random(),
loadFilter:pagerFilter,
queryParams:buildParams(),
toolbar:"#toolbar",
rownumbers:true,
showFooter: true,
columns: [[
{ field: 'EVAL', title: '费用类别', width:80,align:'center'},
{ field: 'CON', title: '合同报价', width:80,align:'center'},
{ field: 'PCOST', title: '成本预算', width:80,align:'center'},
{ field: 'BOR', title: '预借款', width:80,align:'center'}
]]
// fitColumns:true//自适应宽度、可以水平滚动
});
 function compute() {//计算函数
var rows = $('#personManage').datagrid('getRows')//获取当前的数据行
var ptotal = 0//计算listprice的总和
,utotal=0//统计unitcost的总和
,btotal=0;//统计unitcost的总和
for (var i = 0; i < rows.length; i++) {
ptotal += rows[i]['CON'];
utotal += rows[i]['PCOST'];
btotal += rows[i]['BOR'];
}
//新增一行显示统计信息
$('#personManage').datagrid('appendRow', { EVAL: '<b>统计:</b>', CON: ptotal, PCOST: utotal ,BOR : btotal});
}

JSP页面

<table id="personManage">
</table>

统计easyui datagrid某列之和显示在对应列下面的更多相关文章

  1. easyui datagrid 没数据时显示滚动条的解决方法

    今天解决了一个bug,因为datagrid有多列,可是当没有数据的时候,后面的列无法通过滚动条拉动来显示,比较麻烦,而需求要求没有数据也要拉动滚动条查看后面有什么列,一开始在网上找了一些资料,发现都不 ...

  2. 解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中

    背景:   昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...

  3. easyui datagrid 诡异的无法显示问题

    举个应用场景的例子来说明: 在采购单的编辑页面,上方为采购单自身的属性信息,下方使用tabs控件,加入两个tab页,分别为采购明细列表(DataGrid)和审核记录列表(DataGrid),即一个主业 ...

  4. JQuery easyUi datagrid 中 自定义editor作为列表操作按钮列

    转自   http://blog.csdn.net/tianlincao/article/details/7494467 前言 JQuery easyUi datagrid 中 使用datagrid生 ...

  5. EasyUI DataGrid 修改每页显示数量的最大值&&导出Grid到Excel

    首先,最近在搞那个DataGrid的导出,发现,网上的用JS导出到本地的方法虽然可用,但是只能导出DataGrid当前的数据,例如说,DataGrid默认是最大显示50行,但是如果有多页,那么就无法显 ...

  6. jquery easyui datagrid设置可编辑行的某个列不可编辑

    function onClickRowd(index1, field1) { if (editIndexd != index1) { if (endEditing()) { $('#dg').data ...

  7. Easyui datagrid 显示隐藏列

    html:         <div style="float: left; width: 1450px; height:auto;  ">             & ...

  8. EasyUI datagrid组件绑定有转义字符的json数据出错

    最近项目中一个页面的datagrid出现了莫名其妙的问题, 首先是分页数据的第二页和第三页不能展示,过了一天后第一页也出不来了, 默认首页不出来导致后续分页处理无法进行, 整个数据都不出来了,最后只能 ...

  9. easyui datagrid 列隐藏和显示

    easyui datagrid 列隐藏和显示 用js怎么控制列的显示和隐藏?   最佳答案   $('#grid').datagrid('hideColumn','列field');把hideColu ...

随机推荐

  1. Python开发【前端】:DOM

    DOM(文档对象模型(Document Object Model)) 文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.在网页 ...

  2. Java NIO:NIO概述

    Java NIO:NIO概述 在上一篇博文中讲述了几种IO模型,现在我们开始进入Java NIO编程主题.NIO是Java 4里面提供的新的API,目的是用来解决传统IO的问题.本文下面分别从Java ...

  3. (基础篇)php中理解print EOT分界符和echo EOT的用法区别

    html与php编写中echo可以同时输出多个字符串,并不需要圆括号. print只可以同时输出一个字符串,需要圆括号. print的用法和C语言很像,所以会对输出内容里的%做特殊解释. echo无返 ...

  4. 使用 Sublime、WebStorm 开发 Jade

    Sublime.WebStorm (PhpStorm) 是前端开发者的得力工具,开发 Jade 也不例外. 在配置这些软件的 Jade 开发环境前,请先在系统中安装 Node.js 和 Jade : ...

  5. WPF中获得控件相对于控件的相对位置

    GeneralTransform generalTransform = lstitem.TransformToAncestor(this.BackStack); Point point = gener ...

  6. 在脚本中操作plist文件

    终端输入: /usr/libexec/PlistBuddy -c "Print CFBundleIdentifier" /Users/achen/Desktop/testBundl ...

  7. android打印调用栈

    在某些机器上,不能下断点,出现了某个诡异的问题,想到唯一的解决方式,就是打印调用栈了,google发现这个,记录下,以后备用 Log.d(",Log.getStackTraceString( ...

  8. bzoj1136&colon; &lbrack;POI2009&rsqb;Arc

    Description 给定一个序列{ai | 1 <= ai <= 1000000000 且 1 <= i <= n 且 n <= 15000000}和一个整数 k ( ...

  9. JMeter Building a Database Test Plan

    Building a Database Test Plan In this section, you will learn how to create a basic Test Planto test ...

  10. 《Algorithms 4th Edition》读书笔记——3&period;1 符号表&lpar;Elementary Symbol Tables&rpar;-Ⅳ

    3.1.4 无序链表中的顺序查找 符号表中使用的数据结构的一个简单选择是链表,每个结点存储一个键值对,如以下代码所示.get()的实现即为遍历链表,用equals()方法比较需被查找的键和每个节点中的 ...