programmatically moving grid columns

[jpierce]

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?

[stworthy]

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.

[jpierce]

Worked great, thanks!