EasyUI 使用DataGrid并使用分页及复选框,支持格式化数据
来源:互联网 发布:js 圆形进度条 编辑:程序博客网 时间:2024/06/01 09:02
<div style="margin: 20px 0px 0px 0px">
<table id="dg" ></table>
</div>
<script type="text/javascript">
var appPath="<%=request.getContextPath()%>";
function initdata(){
$('#dg').datagrid({
url:getXXX.action,
pagination:true,//启动分页
autoRowHeight : true,
checkOnSelect : false,//为false,当用户仅在点击该复选框的时候才会呗选中或取消
rownumbers:true,//显示行号
columns:[[ //以下是定义列名
{field:'id',title:'选择',checkbox:'true',width:'20%'},
{field:'serialNumber',title:'终端串号',halign:'center',width:'20%'},
{field:'mac',title:'MAC地址',halign:'center',width:'20%'},
{field:'deviceType.prodName',title:'设备类型',halign:'center',width:'20%',
formatter: function(value,row,index){//自定义显示数据,可显示object.object.obj...property 及判断值的不同显示不同内容
if (row.deviceType.prodName){
return row.deviceType.prodName;
} else {
return value;
}
}},
{field:'operate',title:'操作',halign:'center',width:'20%',
formatter: function(value,row,index){
if (row.id){
var updateurl = "<a href=\"javascript:onAddClicked('"+row.id+"')\">" +
"添加设备</a>";
return updateurl;
} else {
return value;
}
}
}
]]
});
}
function doSearch(value){//查询方法
$('#dg').datagrid('load', { //下面是key:value
deviceserialNumber: $('#serialNumber').val(),
deviceType:$('#deviceType').val(),
devicemac:$('#devicemac').val()
});
}
function onAddClicked(devId){
var devGroupId = $('#deviceGroupid').val();
var url = appPath+"/ssudevicegroup/addDeviceToGroup.action?deviceGroup.id="+devGroupId+"&device.id="+devId;
addurl(url);
}
function addDeviceExMac(){
var values = $('#dg').datagrid('getChecked');//获取所有被选中的行
if(values.length < 1){
JDialog.showMessage("请至少选择一条信息!");
return false;
}
var arrayObj = new Array();
$.each(values, function(index, item){//获取所有被选中的行中的某列或多列的值
arrayObj.push("''"+item.id+"''");
});
var devGroupId = $('#deviceGroupid').val();
var url = appPath+"/ssudevicegroup/addDeviceListToGroup.action?deviceGroup.id="+devGroupId+"&&devIds=" + arrayObj.join(",");
addurl(url);
}
function addurl(url){
$.getJSON(url,{},function(data){
if(data){
$('#dg').datagrid('reload');
JDialog.showMessage("添加设备信息成功!");
}else{
$('#dg').datagrid('reload');
JDialog.showError("添加设备信息失败!");
}
});
}
$(function(){初始化数据
initdata();
});
- EasyUI 使用DataGrid并使用分页及复选框,支持格式化数据
- 使用easyUI 格式化datagrid列
- easyUI dataGrid 列表分页使用
- EasyUI DataGrid 复选框
- easyui datagrid使用数据刷新
- jquery easyui datagrid使用,分页、排序、查询
- Easyui 使用datagrid分页 详解 代码
- jquery easyui datagrid使用,分页、排序、查询
- easyui的datagrid使用以及分页
- C# 使用easyUI datagrid 实现后台分页
- easyUI使用datagrid分页栏不显示
- Bootstrap复选框、EasyUI datagrid复选框
- jQuery easyUi 数据表格DataGrid 分页查询及常见问题解析
- easyui-datagrid分页及跨页勾选
- 使用JQuery EasyUI 中的DataGrid控件实现数据的分页(紧密结合上一篇博客)
- asp.net 中使用EasyUI Datagrid 加载动态数据分页查询
- 关于EasyUI Datagrid 数据网格使用策略
- Easyui Datagrid 数据网格---我的使用
- 两个对象值相同 (x.equals(y) == true) ,但可有不同的 hash code ,这句话对不对?
- 完美解决高通mtkk双卡信息的获取
- 动态规划经典问题03:数组中最大的数对差(或最小的数对差)
- 当前绝对路径和相对路径
- Linux 内核 由block_read和block_write函数引发的设备块号转换问题的思考
- EasyUI 使用DataGrid并使用分页及复选框,支持格式化数据
- (!!)Integration of Polynomial
- UVA The most distant state
- ubuntu下共享文件夹的实现方式
- iOS 拍照
- ZOJ Problem Set - 1655
- fork() && fork() || fork()
- Eclispe4.4 TomcatPlugin 安装
- Python学习