Print Page - programmatically moving grid columns

Title: programmatically moving grid columns
Post by: jpierce on October 08, 2013, 03:29:49 PM

I know gui drag/drop would be a pain to implement and don't expect it to happen anytime soon. Alternatively, I want to offer my users a choice on a header popup menu that says "move field left" (or right). To do that, all I need to do is rearrange the grid's columns and get it to redraw the grid. I can sort of do that, in that I can rearrange the columns and assign them back to the grid's options. But the only thing I can find to call is a full grid reload via elem.datagrid(), which unfortunately also re-requests the data from the server.

Is there some function I can use to tell it to just redraw the grid?

Title: Re: programmatically moving grid columns
Post by: stworthy on October 09, 2013, 12:45:51 AM

Here is the extended method that can re-create datagrid without sending request.

Code:

$.extend($.fn.datagrid.methods,{
	recreate:function(jq){
		return jq.each(function(){
			var dg = $(this);
			var opts = dg.datagrid('options');
			var url = opts.url;
			var pageNumber = opts.pageNumber;
			opts.url = null;
			var data = dg.datagrid('getData');
			dg.datagrid();
			dg.datagrid('loadData',data);
			setTimeout(function(){
				opts.url = url;
				opts.pageNumber = pageNumber;
				dg.datagrid('getPager').pagination('refresh',{pageNumber:pageNumber});
			},0);
		});
	}
});

Calling $('#dg').datagrid('recreate') is same as $('#dg').datagrid() but does not re-request data from server.

Title: Re: programmatically moving grid columns
Post by: jpierce on October 21, 2013, 07:54:58 AM

Worked great, thanks!

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jpierce on October 08, 2013, 03:29:49 PM