首页 > 其他分享 >Jquery EasyUI datagrid分页

Jquery EasyUI datagrid分页

时间:2023-03-02 13:33:09浏览次数:49  
标签:Jquery field EasyUI title align datagrid width true left


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body>
<table id="people_datagrid"></table>
</body>
</html>

 



//显示人员列表的方法
function peopleList(buildingId, selectFloor, selectRoom, pSex,peopleNameOrIdentity) {
$('#people_datagrid').datagrid({
title : '人员列表',
nowrap : true,// 在数据满行 后是否自动截取
height : 360,
rownumbers : true,// 显示行数
pageSize : 10,// 显示多少条记录
striped : true,
// fitColumns:true, //适度列宽
singleSelect : true,
collapsible : true,
// url:ctxPath+'/peopleController/searchFloorPeople.action?id='+buildingId+'&selectFloor='+selectFloor+'&selectRoom='+selectRoom+'&pSex='+pSex+'&peopleNameOrIdentity='+peopleNameOrIdentity,
url : ctxPath
+ '/peopleController/searchFloorPeople.action?id='
+ encodeURI(buildingId) + '&selectFloor='
+ encodeURI(selectFloor) + '&selectRoom='
+ encodeURI(selectRoom) + '&pSex='
+ encodeURI(pSex) + '&peopleNameOrIdentity='
+ encodeURI(peopleNameOrIdentity),
remoteSort : false,
idField : 'id',
pagination : true,
striped : true,
sortName : 'id',
sortOrder : 'asc',
onl oadSuccess : function(data) {
if (data.total == 0) {
/*
* $.messager.show({ title:'信息提示',
* msg:'没有找到相应信息!', showType:'show' });
*/
}
},
columns : [ [
{
title : '姓名',
field : 'NAME',
width : 48,
sortable : true,
align : 'left'
},
{
title : '性别',
field : 'SEX',
width : 30,
sortable : true,
align : 'left'
},
{
title : '身份证',
field : 'IDENTITY_CARD',
width : 120,
sortable : true,
align : 'left'
},
{
title : '出生日期',
field : 'BIRTHDAY',
width : 67,
sortable : true,
align : 'left'
},
{
title : '民族',
field : 'NATION',
width : 38,
sortable : true,
align : 'left'
},
{
title : '联系电话',
field : 'LINK_TEL',
width : 70,
sortable : true,
align : 'left'
},
{
title : '定位',
field : 'ID',
align : 'center',
formatter : function(value, rowData,
rowIndex) {
return '<span style="color:blue"><a style="text-decoration: none;" href="javascript:peopleloc('
+ buildingId
+ ','
+ value
+ ');">详细信息</a>';
},
width : 60,
align : 'left'
} ] ]
});
}



 

标签:Jquery,field,EasyUI,title,align,datagrid,width,true,left
From: https://blog.51cto.com/u_4427045/6096031

相关文章

  • jQuery中的on方法详细介绍
    on()方法在被选元素及子元素上添加一个或多个事件处理程序。如需移除事件处理程序,请使用off()方法。如需添加只运行一次的事件然后移除,请使用on......
  • jQuery中选择器(包含实例)
    因为我查了一下,发现网上别人总结的确实也都不错了,所以我下面主要是对选择器的使用(其实主要还是为了督促自己多练习使用啦)推荐两个我觉得不错的关于选择器的总结:​​jQuery选......
  • Jquery的一些有意思的操作
    在jquery中有如下结构:div(buttonspanbutton)(1)我们可以通过伪类选择器:firstchild,:lastchild来快速选择这两个button。button:firstchild其实际就是带序号的选定了一个b......
  • 3_1jQuery操作属性和样式
     jQuery操作属性和样式操作属性原生js中的通过元素.属性名或者元素.setAttribute()方式操作元素属性,jQuery给我们封装了attr()和removeAttr(),更加便捷的操作属性  ......
  • 3_1jQuery操作属性和样式
     jQuery操作属性和样式操作属性原生js中的通过元素.属性名或者元素.setAttribute()方式操作元素属性,jQuery给我们封装了attr()和removeAttr(),更加便捷的操作属性  ......
  • 3_1jQuery操作属性和样式
     jQuery操作属性和样式操作属性原生js中的通过元素.属性名或者元素.setAttribute()方式操作元素属性,jQuery给我们封装了attr()和removeAttr(),更加便捷的操作属性  ......
  • 3_1jQuery操作属性和样式
    ​ jQuery操作属性和样式操作属性原生js中的通过元素.属性名或者元素.setAttribute()方式操作元素属性,jQuery给我们封装了attr()和removeAttr(),更加便捷的操作属性......
  • 3_1jQuery操作属性和样式
    ​ jQuery操作属性和样式操作属性原生js中的通过元素.属性名或者元素.setAttribute()方式操作元素属性,jQuery给我们封装了attr()和removeAttr(),更加便捷的操作属性......
  • 如何使用jQuery自动滚动到页面底部?
      这个$(document).scrollTop($(document).height());  <!DOCTYPEhtml><html><head><title>ScrollAutomatically</title><scriptsrc="https......
  • jQuery 好用的丰富JS函数库
    课程简介和目标为什么使用jQuery?使用原生JavaScript编码存在问题1选择器功能弱2DOM操作繁琐之极3浏览器兼容性不好4动画功能弱jQuery的优点1强大的选择器2出色的DOM......