zoukankan      html  css  js  c++  java
  • draggable datagrid columns

    $.extend($.fn.datagrid.methods,{
    columnMoving: function(jq){
    return jq.each(function(){
    var target = this;
    var cells = $(this).datagrid('getPanel').find('div.datagrid-header td[field]');
    cells.draggable({
    revert:true,
    cursor:'pointer',
    edge:5,
    proxy:function(source){
    var p = $('<div class="tree-node-proxy tree-dnd-no" style="position:absolute;border:1px solid #ff0000"/>').appendTo('body');
    p.html($(source).text());
    p.hide();
    return p;
    },
    onBeforeDrag:function(e){
    e.data.startLeft = $(this).offset().left;
    e.data.startTop = $(this).offset().top;
    },
    onStartDrag: function(){
    $(this).draggable('proxy').css({
    left:-10000,
    top:-10000
    });
    },
    onDrag:function(e){
    $(this).draggable('proxy').show().css({
    left:e.pageX+15,
    top:e.pageY+15
    });
    return false;
    }
    }).droppable({
    accept:'td[field]',
    onDragOver:function(e,source){
    $(source).draggable('proxy').removeClass('tree-dnd-no').addClass('tree-dnd-yes');
    $(this).css('border-left','1px solid #ff0000');
    },
    onDragLeave:function(e,source){
    $(source).draggable('proxy').removeClass('tree-dnd-yes').addClass('tree-dnd-no');
    $(this).css('border-left',0);
    },
    onDrop:function(e,source){
    $(this).css('border-left',0);
    var fromField = $(source).attr('field');
    var toField = $(this).attr('field');
    setTimeout(function(){
    moveField(fromField,toField);
    $(target).datagrid();
    $(target).datagrid('columnMoving');
    },0);
    }
    });

    // move field to another location
    function moveField(from,to){
    var columns = $(target).datagrid('options').columns;
    var cc = columns[0];
    var c = _remove(from);
    if (c){
    _insert(to,c);
    }

    function _remove(field){
    for(var i=0; i<cc.length; i++){
    if (cc[i].field == field){
    var c = cc[i];
    cc.splice(i,1);
    return c;
    }
    }
    return null;
    }
    function _insert(field,c){
    var newcc = [];
    for(var i=0; i<cc.length; i++){
    if (cc[i].field == field){
    newcc.push(c);
    }
    newcc.push(cc[i]);
    }
    columns[0] = newcc;
    }
    }
    });
    }
    });

    当dg 初始化后 ,调用此方法
    $('#tt').datagrid('columnMoving');
  • 相关阅读:
    hdu1506(dp)
    windows下安装JMeter
    phpstudy 80端口被占用,修改端口
    久违的phpstorm
    软件项目版本号的命名规则及格式
    phpstudy 局域网访问
    java+eclipse+selenium环境搭建
    软件测试方法汇总
    功能测试大全
    如何有效地描述软件缺陷(Defect)?
  • 原文地址:https://www.cnblogs.com/huangf714/p/6229270.html
Copyright © 2011-2022 走看看