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. [CAMCOCO][C#]我的系统架构.服务器端.(一)

    尽量少的前言 虽然写了N年代码了,但总觉得什么东西都是囫囵吞枣,无法尽得其精髓.最近整理了一套心目中的架构,如有错误之处,烦劳不吝指正,老胡在此不胜感激!! 第一篇 我心目中的架构 做了无数个系统,写 ...

  2. sql将表中的某个字段进行排序

    . update tempTable set field1 = rownum from( select field1, ROW_NUMBER() over(order by fieldId) rown ...

  3. 初次尝试ColumnStore Index

    1.首先使用非聚集索引 SET STATISTICS IO ON SET STATISTICS TIME ON SELECT MemberId , MAX(AddDT) AS RecentSucDT ...

  4. 通过SQL ID查询SQL Text

    SELECT SQL_ID, SQL_TEXT,FIRST_LOAD_TIME, EXECUTIONS FROM V$SQLAREA where SQL_ID='22v8fyk0juw25';

  5. js判断输入是否为空,获得输入的类型

    使用typeof算法 typeof的运算数未定义,返回的就是 "undefined". 下面定义x为运算数: 有一下5种情况: 运算数为数字 typeof(x) 返回的就是 &qu ...

  6. php面向对象的多态

    多态是指使用类的上下文来重新定义或改变类的性质或行为,或者说接口的多种不同的实现方式即为多态.把不同的子类对象都当成父类来看,可以屏蔽不同子类对象之间的差异,写出通用的代码,做出通用的编程,以适应需要 ...

  7. ARM你必须知道的事儿——为啥“PC = PC + 8”?

    为啥是“PC = PC + 8”: “PC = PC + 8”其实这样写容易让人蒙了.“PC = PC + 8”真正含义应该是: 执行处代码地址 = PC - 8: 也就是说,”PC指向的地址“领先“ ...

  8. ionic项目相关的操作命令

     更新npmD:\Program Files\npm-3.9.0\npmnode cli.js install npm -gf vs安装 更新node.js  windows版直接从官网下载安装包 n ...

  9. Jquery Slick幻灯片插件

    slick 是一个基于 jQuery 的幻灯片插件,具有以下特点: 支持响应式 浏览器支持 CSS3 时,则使用 CSS3 过度/动画 支持移动设备滑动 支持桌面浏览器鼠标拖动 支持循环 支持左右控制 ...

  10. VS2015编译错误:调用的目标发生了异常--->此实现不是Windows平台FLPS验证的加密算法的一部分。

    在Win10下安装好几次VS2015(企业版)了,这次发生了一个奇怪的问题,错误截图如下: 控制台.WPF等项目均有此错误!但是ASP.NET项目却可以编译运行!一开始还以为VS2015安装错误,修复 ...