datagrid拖动列头更换排列顺序

在做这个功能的时候在网上找了大量资料,发现都不适用,要不然就是代码太冗余,所以另起炉灶,自己封装了这个函数

下面是完整的代码:

  1 
  2 
  3 
  4     
  5     
  6     
  7     
  8     
  9     
 10     
 11 
 12 
 13 

 14      15 16 17 18 19 20 21 22 23 24 25

     

     

         
X
         
Y
         
Z
         
A
         
B
         
C
     
     
 
 26 
 27 

 28      29 30 31 32 33 34 35 36 37 38

     

     

         
X
         
Y
         
Z
         
A
         
B
         
C
     
 
 39 
 40 
 99 
100 

 

我定义了两个table,table外部必须包裹有唯一id的div,这是要保证两个table之间的操作互不影响.

主要实现功能的就是remove()这个函数,里面传入的参数是table外面div的ID,这样可以区分两个table的操作。

如果你的页面只有一个table的话不传参数也是可以的,也可以把limit参数相关的代码删除.

remove()函数需要在datagrid数据加载完成后调用,否则拖动时只有列头改变.

缺点:

这个函数虽然解决了列表拖动的问题,同时也产生了新的问题--------单击排序

当鼠标放到列头时会变成可拖动的标识,这时排序就没用了吗?当然不是,虽然单击时有影响,但是我发现双击还是有用的哦!

如果你对这个缺点不能容忍的话,欢迎提出新的解决方案.

请尊重别人的劳动成果,转载务必标明出处!

 

转载于:https://www.cnblogs.com/AnnieShen/p/6478324.html