`

easyui的datagrid获得自定义json信息

阅读更多

案例:

使用easyui的datagrid进行局部刷新时, table外的其他区域也要根据返回的数据动态取得值。

function loadData() {
	$('#tb_list').datagrid('reload',{
		name1: $('#name1').val(),
		name2:$('#name2').val()
	});
	// 取得返回的列 更新tb_list外的其他区域
}

 -------------------------------------------------------------------------------------

遇到一个问题,需要获得datagrid的总行数,把datagrid的API找了一遍,getRows这个方法也只能获取当前页中记录的行数.

发现datagrid依赖pagination这个组件,从这个线索找还真的找到了, 分享出来.

var options = $('#resulttable').datagrid('getPager').data("pagination").options;  
var totalRowNum = options.total;

第一行:getPager获取页面对象进而获取pagination这个组件.
第二行:pagination组件提供了total这个属性.

 

From: http://blog.163.com/liuyb_94242/blog/static/421676462012111944220392/

---------------------------------------------------------------------------------------------------

原创文章,转载请标明出处:http://hae.iteye.com/blog/2101477

 

上面是在网上找的,可能是因为没有使用easyui自带的分页标签,而使用了项目自定义的分页标签,所以easyui到这里$('#resulttable').datagrid('getPager')已经是空了,无法获得总行数,后来自己调试+跟踪+摸索了半天终于找到了一个解决方法:

 

服务器端返回json对象自定义:

public class DatagridJson {
	private int total;
	private List<Row> rows;
	private Map<String, String> footer; //自定义,封装自己想要得到的后台数据

	// get, set 方法省略。。。。
}

 

原创文章,转载请标明出处:http://hae.iteye.com/blog/2101477

 

使用ajax 请求服务器端controller时,将返回的json对象组装为自己有用的信息:

...
datagridJson.setRows(rowList);
Map<String, String> footer = new HashMap<String, String>();

footer.put("key1", "name1");
footer.put("key2", "name2");
footer.put("key3", "name3");
......
datagridJson.setFooter(footer);
return datagridJson;

 最后前台使用如下方法:

function loadData() {
	$('#tb_list').datagrid('reload',{
		name1: $('#name1').val(),
		name2:$('#name2').val()
	});
	// 取得返回的列 更新tb_list外的其他区域
	var footer = $('#tb_list').datagrid('getFooterRows');
	if (footer === undefined || footer == null) {
		return;
	}
	var key1 = footer['name1'];
	var key2 = footer['name2'];
	var key3 = footer['name3'];
	
	// 拿到后台的值 然后该干什么就干什么吧。
}
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics