easyui toolbar 可以放在datagrid底下

时间:2022-02-24 09:22:37

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底下