jQuery datagrid

项目中使用了easyUI,在此记录一下

1. 组装访问后台获取datagrid数据所需要的参数

function getParams(){
//获取页面网页元素的值
var eVal = $("#e1").val();
var eVal2 = $("#e2").val();
//去掉左右空格
var queryParams={};
queryParams.e =$.trim(eVal);
queryParams.e2 = $.trim(eVal2);
return queryParams;
}

2. 在callback方法中,组织datagrid

var examleDataGrid = $("<table id='examleDataGrid'></table>");
		$("#example_table").append(examleDataGrid);		
		examleDataGrid
				.datagrid(// 此处表示生成一个表格,并动态创建行列关系
				{
					// title : 'example列表',// 表格标题
					loadMsg : '正在加载数据...',// 此处设置数据加载的动态效果
				//	  width : '100%',// 表格宽度
					// height:500,//表格高度
					striped : true,// 表格奇偶行颜色交替变化
					collapsible : true,// 可折叠,即某一行太长,自动换行
					fitColumns : true,// 自动调整各列,则各列的宽度值为一个比例值
					pagination : true,// 分页工具
					//rownumbers : true,// 表示显示行号
					url : example_webRoot + 'example.ajax',
					queryParams: getParams(),
					pageSize : 20,
					pageList : [ 10 , 20,50 ],
					columns : [ [
...........

3. 对datagrid数据进行操作后,在reload datagrid时想让datagrid显示在第一页
(例如页面有搜索按钮,在datagrid翻至第二页时点击搜索,jQuery默认停留在点击前的页面,一页显示的条数也没变,这样的情况是不合理的)

//点击页面的【搜索】,触发的方法
search : function() {
			//搜索后的datagrid数据将显示第一页的内容,并将页数栏置为1
			var $grid = $("#exampleDataGrid");
			//显示第一页数据  
			$grid.datagrid("options").pageNumber = 1;  
			//分页栏上跳转到第一页,并将一页显示的数据条数设置为20
			$grid.datagrid('getPager').pagination({pageSize:20,pageNumber: 1});  
			//加上参数reload
			$grid.datagrid('options').queryParams=getParams();
			$grid.datagrid("reload");
},

继续关注jQuery....


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值