zoukankan      html  css  js  c++  java
  • 重新=》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.               
    55.             // swap Field to another location  
    56.             function swapField(from,to){  
    57.                 var columns = $(target).datagrid('options').columns;  
    58.                 var cc = columns[0];  
    59.                 _swap(from,to);  
    60.                 function _swap(fromfiled,tofiled){  
    61.                     var fromtemp;  
    62.                     var totemp;  
    63.                     var fromindex = 0;  
    64.                     var toindex = 0;  
    65.                     for(var i=0; i<cc.length; i++){  
    66.                         if (cc[i].field == fromfiled){  
    67.                             fromindex = i;  
    68.                             fromtemp = cc[i];  
    69.                         }  
    70.                         if(cc[i].field == tofiled){  
    71.                             toindex = i;  
    72.                             totemp = cc[i];  
    73.                         }  
    74.                     }  
    75.                     cc.splice(fromindex,1,totemp);  
    76.                     cc.splice(toindex,1,fromtemp);  
    77.                 }  
    78.             }  
    79.         });  
    80.     }  
    81. });  

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

  • 相关阅读:
    HNOI2014
    HNOI2018
    HNOI2015
    HNOI2016
    Luogu4099 HEOI2013 SAO 组合、树形DP
    CF915G Coprime Arrays 莫比乌斯反演、差分、前缀和
    CF1110H Modest Substrings AC自动机、DP
    CF1110E Magic Stones 差分
    CentOS 7 配置OpenCL环境(安装NVIDIA cuda sdk、Cmake、Eclipse CDT)
    LeetCode(134) Gas Station
  • 原文地址:https://www.cnblogs.com/huangf714/p/5872950.html
Copyright © 2011-2022 走看看