html:

 <div class="easyui-tabs" style="height: 250px;" tools="#t_rank">
<div title="指标排名">
<table id="dg_rank">
</table>
</div>
</div> <div id="toolbar" class="datagrid-toolbar">
<a class="easyui-linkbutton" plain="true" onclick="" title="充电总金额">1</a>
<a class="easyui-linkbutton" plain="true" onclick="" title="按平均充电量">2</a>
<a class="easyui-linkbutton" plain="true" onclick="" title="按运行故障率">3</a>
<a class="easyui-linkbutton" plain="true" onclick="" title="按卡消费总额">4</a>
</div>

js:

/**
* *指标排名datagrid
**/
function rank() {
$('#dg_rank').datagrid({
url: '../../WebService/WarnRecService.ashx',
queryParams: { action: 'findbytelesignallingwarn2', warnType: '', zhanBh: '', yunXinBh: '', kssj: '', jssj: '', clfs: '' },
fit: true,
singleSelect: true,
border: false,
striped: true,
showFooter: true,
     toolbar:'#toolbal',
buttons: '#toolbar',
columns: [[
{ field: 'Id', hidden: true },
{ field: 'CodeName', title: '类型', align: 'center', width: 100 },
{ field: 'OccurDt', title: '时间', align: 'center', width: 150 },
{ field: 'ZhanJc', title: '场站名称', align: 'center', width: 150 },
{ field: 'YunXing_Bh', title: '桩运行编号', align: 'center', width: 113 },
{ field: 'LogDesc', title: '内容', align: 'center', width: 340 },
{
field: 'ProcessFlag',
title: '处理情况',
width: 60,
align: 'center',
formatter: function (value, row, index) {
var str = "";
switch (row.ProcessFlag) {
case 0:
str = "<a href='#' onclick='OffPolice_click(\"" + row.Id + "\")' class='easyui-linkbutton' plain='true' title='' iconcls='icon-cancel'></a>";
break;
case 1:
case 2:
str = "<a href='#' class='easyui-linkbutton' plain='true' title='' iconcls='icon-ok'></a>";
break;
default:
}
return str;
}
},
{
field: 'content',
title: '处理方式',
align: 'center',
width: 100,
formatter: function (value, row, index) {
var str = row.ProcessFlag;
switch (str) {
case 0:
str = "未处理";
break;
case 1:
str = "自动灭警";
break;
case 2:
str = "手动灭警";
break;
default:
}
return str;
}
}
]],
onLoadSuccess: function () {
$($('#dg_rank').datagrid("getPanel")).find('a.easyui-linkbutton').linkbutton();
insertHtmlInDom();
}
});
} /**
* *在id为da_rank的父节点外面添加id为toolbar的div
**/
function insertHtmlInDom() {
 $('#dg_rank').parent().after($('.datagrid-toolbar'));
}

显示:

easyui toolbar 可以放在datagrid底下的更多相关文章

  1. easyui textarea回车导致datagrid 数据无法展示的问题

    textarea换行 在easyui中的datagrid中使用行内编辑时textarea的换行保存到mysql数据库为\n在textarea中输入回车符 在js读取textarea中的值有\r\n然后 ...

  2. 在jQuery EasyUI中实现对DataGrid进行编辑

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  3. easyui+ashx 动态初始化datagrid(动态列头)

    效果图: 1:简单初始化 JSON格式数据如下(后台自己构建,后台代码略): {"total":6,"columns":[{"field": ...

  4. 【Jqurey EasyUI+Asp.net】---DataGrid增加、删、更改、搜

    在前面写了两,但不知道如何完成,对比刚刚开始学这个,他们摸着石头过河,一步步.在最后两天DataGridCRUD融合在一起.因此份额.我希望像我这样谁是刚刚开始学习一些帮助. 直接主题酒吧. 它是说数 ...

  5. EasyUI实战篇之datagrid:如何重新设置datagrid所配置的属性(options)并重新查询列表(relaod)

    http://www.stepday.com/topic/?873 今天在使用EasyUI的datagrid列表组件想实现一个列表的展现,且列表上方有搜索条件,初始化的时候我是这样配置的: 1.< ...

  6. easyui分页,编辑datagrid某条数据保存以后跳转到某一页

    参考资料:http://caizhilin2010.iteye.com/blog/1731698 问题:商品列表页面采用easyui的datagrid展示数据,编辑某行数据保存以后,要求跳转到 用户在 ...

  7. jQuery EasyUI - 数据表格(DataGrid)

    由于工作需要,项目使用前端 jQuery EasyUI - DataGrid 来控制数据表格. 1.加载相关js和css,因为easyui依赖jquery,所有加载easyui前要先加载jquery, ...

  8. easyUI跨Tab操作datagrid

    1.在datagrid那个页面定义方法 window.top["RELOAD_MY_DATAGRID"]=function(){ $("#dg").datagr ...

  9. jquery easyui window中的datagrid,只能显示一次问题

    最近项目中用到easyui 的动态创建window ,window中嵌入了datagruid.第一次打开是能显示数据,但再次打开时确没显示: 注:url已成功返回了数据. 多次查阅easyui帮助文档 ...

随机推荐

  1. 《JavaScript高级程序设计》笔记——关于继承

    继承在JavaScript中是一种“奇葩”的存在,因为其本身并没有类(class)的概念(ES5),所以只能用其他方式(原型链.构造函数.对象实例)来模拟继承的行为.既然是模拟,那就应该是想办法实现继 ...

  2. Redis中hash表中的field的value自增可以用hincrby

    Redis HINCRBY命令用于增加存储在字段中存储由增量键哈希的数量.如果键不存在,新的key被哈希创建.如果字段不存在,值被设置为0之前进行操作. 回复整数,字段的增值操作后的值. redis ...

  3. 使用c#将多个文件放入文件夹中,并压缩下载

    ZipClass.cs  这个是一个压缩文件的类,可直接复制使用,使用到的命名空间是 using System.IO;using ICSharpCode.SharpZipLib;using ICSha ...

  4. jQuery中的DOM操作<思维导图>

    DOM是Document Object Model的缩写,意思是文档对象模型.DOM是一种与浏览器.平台.语言无关的接口.使用该接口可以轻松地访问页面中所有的标准组件.简单来说,DOM解决了Netsc ...

  5. MYSQL多实例配置与使用教程

    原文http://www.111cn.net/database/mysql/58651.htm 在实际的开发过程中,可能会需要在一台服务器上部署多个MYSQL实例,那建议使用MYSQL官方的解决方案 ...

  6. PHP使用empty检查函数返回结果时报Fatal error: Can't use function return value in write context的问题

    PHP开发时,当你使用empty检查一个函数返回的结果时会报错:Fatal error: Can't use function return value in write context 例如: &l ...

  7. java集合学习一

    首先看一下java集合的关系图 1.1从全面了解Java的集合关系图.常见集合  list  set map等其中我们最常用的 list  map 结合.几天说一下常见的map.map在我工作的两年里 ...

  8. JavaScript创建对象的写法

    JavaScript 有Date.Array.String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发者自定义对象.   对象是什么 从 ...

  9. Dll学习一_Dll 创建并动态引用窗体且释放窗体Demo

    1.新建Dll工程 2.Dll工程全部代码 library SubMain; { Important note about DLL memory management: ShareMem must b ...

  10. Oracle 表的访问方式(2)-----索引扫描

    索引扫描(Index scan) 我们先通过index查找到数据对应的rowid值(对于非唯一索引可能返回多个rowid值),然后根据rowid直接从表中得到具体的数据,这种查找方式称为索引扫描或索引 ...