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. Joson的简单用法

    Josn实体类如下: public class Result { public int StatusCode { get; set; } public string Message { get; se ...

  2. SQL_UNPIVOT(行列转换)

    --临时表 insert into ##table([column1],S1, S2,S3)VALUES('VALUE','VALUE','VALUE','VALUE') --把原S1, S2,S3列 ...

  3. 集合框架学习之Collection和Map详解

    线性表,链表,哈希表是常用的数据结构,在进行Java开发时,JDK已经为我们提供了一系列相应的类来实现基本的数据结构.这些类均在java.util包中.本文试图通过简单的描述,向读者阐述各个类的作用以 ...

  4. MVC为模型增加正则表达式

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA0sAAACJCAIAAABy7jQDAAAVTUlEQVR4nO3dv640yVnH8bmJvQpLBI

  5. ESB数据发布思路

    通过esb已经将数据采集进数据库,现在需要开放一个接口,接受请求参数,进而通过参数进行数据查询,返回一段json格式的数据. ▼流程图: 刚开始尝试了很多个版本,可能是esb开发工具还用不熟练的原因吧 ...

  6. 10款很酷的HTML5动画和实用的HTML5应用

    1.HTML5的画布花朵生成器可生成多种样式的花朵 HTML5非常流行,利用HTML5制作动画也非常方便,今天要分享一款利用HTML5 Canvas制作的花朵生成器,我们只需要在Canvas画布上点击 ...

  7. DFS入门之二---DFS求连通块

    用DFS求连通块也是比较典型的问题, 求多维数组连通块的过程也称为--“种子填充”. 我们给每次遍历过的连通块加上编号, 这样就可以避免一个格子访问多次.比较典型的问题是”八连块问题“.即任意两格子所 ...

  8. [GeekBand]C++高级编程技术(2)

    本篇笔记主要分为两个主要部分,第一部分关于对象模型,第二部分是关于new和delete的更加深入的学习. 一.对象模型 关于vptr(虚指针)和vtbl(虚函数表) 只要用到了虚函数,对象中就会多一个 ...

  9. AutoEventWireup="false"

    在 Web 服务器控件中,某些事件(通常是 Click 事件)会导致窗体被回发到服务器.HTML 服务器控件和 Web 服务器控件(如 TextBox 控件)中的更改事件将被捕获,但不会立即导致发送. ...

  10. 获取Class对象的方法及Class类型的一些讨论

    (1)Class.forName(className) (2)classname.Class 如果是数组,则是数组类型[].class (3)对象.getClass() 例: String path ...