1 $.extend($.fn.datagrid.methods,{
2 columnMoving: function(jq){
3 return jq.each(function(){
4 var target = this;
5 var cells = $(this).datagrid('getPanel').find('div.datagrid-header td[field]');
6 cells.draggable({
7 revert:true,
8 cursor:'pointer',
9 edge:5,
10 proxy:function(source){
11 var p = $('<div class="tree-node-proxy tree-dnd-no" style="position:absolute;border:1px solid #ff0000"/>').appendTo('body');
12 p.html($(source).text());
13 p.hide();
14 return p;
15 },
16 onBeforeDrag:function(e){
17 e.data.startLeft = $(this).offset().left;
18 e.data.startTop = $(this).offset().top;
19 },
20 onStartDrag: function(){
21 $(this).draggable('proxy').css({
22 left:-10000,
23 top:-10000
24 });
25 },
26 onDrag:function(e){
27 $(this).draggable('proxy').show().css({
28 left:e.pageX+15,
29 top:e.pageY+15
30 });
31 return false;
32 }
33 }).droppable({
34 accept:'td[field]',
35 onDragOver:function(e,source){
36 $(source).draggable('proxy').removeClass('tree-dnd-no').addClass('tree-dnd-yes');
37 $(this).css('border-left','1px solid #ff0000');
38 },
39 onDragLeave:function(e,source){
40 $(source).draggable('proxy').removeClass('tree-dnd-yes').addClass('tree-dnd-no');
41 $(this).css('border-left',0);
42 },
43 onDrop:function(e,source){
44 $(this).css('border-left',0);
45 var fromField = $(source).attr('field');
46 var toField = $(this).attr('field');
47 setTimeout(function(){
48 moveField(fromField,toField);
49 $(target).datagrid();
50 $(target).datagrid('columnMoving');
51 },0);
52 }
53 });
54
55 // move field to another location
56 function moveField(from,to){
57 var columns = $(target).datagrid('options').columns;
58 var cc = columns[0];
59 var c = _remove(from);
60 if (c){
61 _insert(to,c);
62 }
63
64 function _remove(field){
65 for(var i=0; i<cc.length; i++){
66 if (cc[i].field == field){
67 var c = cc[i];
68 cc.splice(i,1);
69 return c;
70 }
71 }
72 return null;
73 }
74 function _insert(field,c){
75 var newcc = [];
76 for(var i=0; i<cc.length; i++){
77 if (cc[i].field == field){
78 newcc.push(c);
79 }
80 newcc.push(cc[i]);
81 }
82 columns[0] = newcc;
83 }
84 }
85 });
86 }
87 });
//当dg 初始化后 ，调用此方法
1 $('#tt').datagrid('columnMoving');
转自 ：http://www.jeasyui.com/forum/index.php?topic=279.0
