jQuery easyUI datagrid 增加求和统计行的实现代码

 更新时间:2016年06月01日 17:02:31   投稿:jingxian  
下面小编就为大家带来一篇jQuery easyUI datagrid 增加求和统计行的实现代码。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

在datagrid的onLoadSuccess事件增加代码处理。

<style type="text/css">

    .subtotal { font-weight: bold; }/*合计单元格样式*/
  </style>
  <script type="text/javascript">
    function onLoadSuccess() {
      //添加“合计”列
      $('#table').datagrid('appendRow', {
        Saler: '<span class="subtotal">合计</span>',
        TotalOrderCount: '<span class="subtotal">' + compute("TotalOrderCount") + '</span>',
        TotalOrderMoney: '<span class="subtotal">' + compute("TotalOrderMoney") + '</span>',
        TotalOrderScore: '<span class="subtotal">' + compute("TotalOrderScore") + '</span>',
        TotalTrailCount: '<span class="subtotal">' + compute("TotalTrailCount") + '</span>',
        Rate: '<span class="subtotal">' + ((compute("TotalOrderScore") / compute("TotalTrailCount")) * 100).toFixed(2) + '</span>'
      });
    }
    //指定列求和
    function compute(colName) {
      var rows = $('#table').datagrid('getRows');
      var total = 0;
      for (var i = 0; i < rows.length; i++) {
        total += parseFloat(rows[i][colName]);
      }
      return total;
    }
  </script> 

以上这篇jQuery easyUI datagrid 增加求和统计行的实现代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • JQuery判断radio单选框是否选中并获取值的方法

    JQuery判断radio单选框是否选中并获取值的方法

    在本篇文章里小编给大家分享了关于JQuery判断radio单选框是否选中并获取值的方法,需要的朋友们可以学习下。
    2019-01-01
  • JQuery表单验证插件EasyValidator用法分析

    JQuery表单验证插件EasyValidator用法分析

    这篇文章主要介绍了JQuery表单验证插件EasyValidator用法,以实例形式系统分析了EasyValidator的功能特性及具体用法,是非常实用的jQuery插件,需要的朋友可以参考下
    2014-11-11
  • jQuery插件简单学习实例教程

    jQuery插件简单学习实例教程

    这篇文章主要介绍了jQuery插件的简单用法,列举了分页插件、放大镜插件、自动完成插件、上传插件、日历插件等的简单使用方法,需要的朋友可以参考下
    2016-07-07
  • 基于jQuery实现页面搜索功能

    基于jQuery实现页面搜索功能

    这篇文章主要为大家详细介绍了基于jQuery实现页面搜索功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-07-07
  • 对象不支持indexOf属性或方法的解决方法(必看)

    对象不支持indexOf属性或方法的解决方法(必看)

    下面小编就为大家带来一篇对象不支持indexOf属性或方法的解决方法(必看)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • jQuery实现大图轮播

    jQuery实现大图轮播

    本文主要分享了jQuery实现大图轮播的示例代码。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • jquery 插件学习(一)

    jquery 插件学习(一)

    jquery插件,有几种方法,有全局的,有对象方法的,一直觉得jquery插件迷迷糊糊,这阵子特地研究下,供那些像我一样的初学者借鉴下。嘻嘻
    2012-08-08
  • jQuery:unbind方法的使用详解

    jQuery:unbind方法的使用详解

    这篇文章主要介绍了jQuery:unbind方法的使用详解的相关资料,unbind方法只能解绑用jQuery的bind方法以及用jquery方法注册的事件处理程序,需要的朋友可以参考下
    2017-08-08
  • jQuery md5加密插件jQuery.md5.js用法示例

    jQuery md5加密插件jQuery.md5.js用法示例

    这篇文章主要介绍了jQuery md5加密插件jQuery.md5.js用法,结合实例形式简单分析了jQuery md5加密插件jquery.md5.js的简单使用技巧,需要的朋友可以参考下
    2018-08-08
  • jquery简单瀑布流实现原理及ie8下测试代码

    jquery简单瀑布流实现原理及ie8下测试代码

    可以将分页获取的内容依次填入四个div中,瀑布流的分页可以以多页(比如5页)为单位二次分页,这样可以减少后台算法的复杂度;测试环境:ie8 ff13.0.1 chrome22有兴趣的朋友可以了解下
    2013-01-01

最新评论