1、设置 showFooter为true

$grid = $dg.datagrid({
// fit: true,
//fitColumns: true,
// pagination: false,
// pageSize: 20,
// pageList: [20, 40, 60, 80, 100],
showFooter:true,
scrollbarSize:0,
border: true,
striped: true,
singleSelect: false,
selectOnCheck: true,
checkOnSelect: true,
remoteSort:false,
rownumbers : false,//不显示序号
method:'get',
columns: [[{field: 'companyname', title: '经销商名称', width: parseInt($(this).width() * 0.2)},
{field: 'goodscount', title: '新增sku数', width: parseInt($(this).width() * 0.1),sortable:true,sorter:numberSort},
{field: 'upgoodscount', title: '在售sku数', width: parseInt($(this).width() * 0.1),sortable:true,sorter:numberSort},
{field: 'goodsSaleCount', title: '下单商品数', width: parseInt($(this).width() * 0.1),sortable:true,sorter:numberSort}
]],
onBeforeLoad: function (param) {
try {
let row = $(this).datagrid('getSelected');
let index = $(this).datagrid('getRowIndex', row);
row_key = index;
} catch (err) {
console.log(err);
} }, onClickCell: function (index, field, value) {
$(this).datagrid('clearSelections');
},
onLoadSuccess: function (data) {
$(this).datagrid('checkRow', row_key);
},
toolbar: '#tb'
});

2、json数据,主要是footer 数组对象

{"total":9,"rows":[
{"id":1,"name":"Chai","price":18.00},
{"id":2,"name":"Chang","price":19.00},
{"id":3,"name":"Aniseed Syrup","price":10.00},
{"id":4,"name":"Chef Anton's Cajun Seasoning","price":22.00},
{"id":5,"name":"Chef Anton's Gumbo Mix","price":21.35},
{"id":6,"name":"Grandma's Boysenberry Spread","price":25.00},
{"id":7,"name":"Uncle Bob's Organic Dried Pears","price":30.00},
{"id":8,"name":"Northwoods Cranberry Sauce","price":40.00},
{"id":9,"name":"Mishi Kobe Niku","price":97.00}
],"footer":[
{"name":"Total","price":282.35},
{"name":"Average","price":31.37}
]}

easyui datagrid 显示 footer的更多相关文章

  1. EasyUI DataGrid 添加 Footer

    做后台管理界面时,EasyUI 的 DataGrid 经常会被用到,有时候一些总的统计数据不合适放在数据表格里,需要单独显示,这时候就可以放在Footer中显示而不必另外布局. 该怎么给 DataGr ...

  2. easyui datagrid显示进度条控制操作

    在当我们需要控制时间前台实际项目页面datagrid显示进度条的数据加载时运行,和datagrid默认情况下只在有url加载运行时的数据显示方式的进度条.下面的代码手动控制: 打开一个进度条: $(' ...

  3. Easyui datagrid 显示隐藏列

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

  4. easyUi DataGrid 显示日期列,时间为空也可,的正常显示,及普通居中列情况

    $('#tt').datagrid({                url: '@Url.Content("~/kpi/FindList")',                w ...

  5. EasyUi Datagrid中footer renderFooter

    默认的'rowStyler' 选项不支持footer,想让footer支持rowStyler的话,dategird就得重写.代码如下. var myview = $.extend({}, $.fn.d ...

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

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

  7. easyui datagrid中datetime字段的显示和增删改查问题

    datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...

  8. 实现easyui datagrid在没有数据时显示相关提示内容

    本示例实现easyui datagrid加载/查询数据时,如果没有相关记录,则在datagrid中显示没有相关记录的提示信息,效果如下图所示 本实例要实现如下图所示的效果: 本示例easyui版本为1 ...

  9. easyui datagrid 列隐藏和显示

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

随机推荐

  1. 5、C++结构体的使用

    5.结构体定义 结构体是用户带定义的类型,而结构声明定义了这种类型的数据属性.定义了类型后,便可以创建这种类型的变量,因此创建结构包括两步.首先,定义结构描述——它描述并标记了能够存储在结构中的各种数 ...

  2. jquery 中 $('div','li')是什么意思?

     Javascript 专业回答   2013-07-18 10:59 这个写法没有错误,而且那个人跟你说的也没错,是选择li里面所有div 前面几位都学艺不精,都说错了 要搞清楚$('div','l ...

  3. REST模式中HTTP请求方法(GET,POST,PUT,DELETE)

    一直在测试REST模式的WEB SERVICE接口,客户端的HTTP的请求方式一般分为四种:GET.POST.PUT.DELETE,这四种请求方式有什么不同呢.简单的说,GET就是获取资源,POST就 ...

  4. sublime text3 添加新片段

    1.tools->developer->new snippet 要介绍一下snippet四个组成部分: content:其中必须包含<![CDATA[…]]>,否则无法工作, ...

  5. Ngnix,EA(Enterprise Architect)

    nginx Nginx (engine x) 是一个高性能的HTTP和反向代理服务,也是一个IMAP/POP3/SMTP服务.Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的Rambler.ru站点 ...

  6. Android ToggleButton(开关函数)与switch (开关按钮)

    1.ToggleButton (1)介绍 (2)组件形状 (3)xml文件设置 <?xml version="1.0" encoding="utf-8"? ...

  7. springMVC下载功能

    前台页面 <a href="download">下载</a> 后台代码 /** * 文件下载 * @param request * @return * @t ...

  8. js 随机数组

    生成指定num-start 个数组长度,值为start---num 的随机数组,不包括num这个值 function rand_arr(num,start) { // 验证值 if(!argument ...

  9. JAVA通过网站域名URL获取该网站的源码(2018

    import java.io.ByteArrayOutputStream;   import java.io.InputStream;   import java.net.HttpURLConnect ...

  10. hdu6325 Interstellar Travel 凸包变形

    题目传送门 题目大意: 给出n个平面坐标,保证第一个点和第n个点y值为0,其余点的x坐标都在中间,要从 i 点走到 j 点的要求是 i 点的横坐标严格小于 j 的横坐标,并且消耗的能量是(xi * y ...