重新=》easyui DataGrid是否可以动态的改变列显示的顺序

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. swapField(fromField,toField);
49. $(target).datagrid();
50. $(target).datagrid(‘columnMoving‘);
51. },0);
52. }
53. });
54. // swap Field to another location
55. function swapField(from,to){
56. var columns = $(target).datagrid(‘options‘).columns;
57. var cc = columns[0];
58. _swap(from,to);
59. function _swap(fromfiled,tofiled){
60. var fromtemp;
61. var totemp;
62. var fromindex = 0;
63. var toindex = 0;
64. for(var i=0; i<cc.length; i++){
65. if (cc[i].field == fromfiled){
66. fromindex = i;
67. fromtemp = cc[i];
68. }
69. if(cc[i].field == tofiled){
70. toindex = i;
71. totemp = cc[i];
72. }
73. }
74. cc.splice(fromindex,1,totemp);
75. cc.splice(toindex,1,fromtemp);
76. }
77. }
78. });
79. }
80. });

调用$(‘#dg‘).datagrid({.....}).datagrid("columnMoving");