分页拖放排序dragsort

本功能针对表格实现分页

需要引用jquery及其插件jqurey.dragsort

处理器参见：  在服务器端实现数据任意排序算法

 

先看一下示例代码：

$('table.list').tableDragsort({
    handler:'/user/sort',     //排序处理器
    selector:'.moveable',     //拖放对象选择器
    data:{}                   //附加参数
    page:2,                   //当前页号
    pageCount:3               //分页总数
});

 

源代码：

$.fn.tableDragsort = function(setting)
{
    setting = $.extend({handler:'', selector:'tr', data:{}}, setting);
    if($(this).find('tbody tr').length > 1 || $(this).find('tbody tr').length == 1 && setting.page > 1){
        var t = $(this);
        var cs = $(this).find('tbody tr:first td').length;
        if(setting.page > 1){
            t.prepend('<tr class="prev"><td colspan="' + cs + '" style="color:#ccc">移到上一页</td></tr>');
        }
        if(setting.page < setting.pageCount){
            t.append('<tr class="next"><td colspan="' + cs + '" style="color:#ccc">移到下一页</td></tr>');
        }
        var ref = function(){
            t.find("tbody tr").each(function(i){$(this).attr('index', i)});
            t.find('.prev').attr('id', '-'+t.find('.prev').next().attr('id'));
            t.find('.next').attr('id', '+'+t.find('.next').prev().attr('id'));
        }
        ref();
        $(this).dragsort({
            dragSelector: setting.selector,
            dragBetween: false,
            placeHolderTemplate: '<tr><td colspan="' + cs + '">&nbsp;</td></tr>',
            itemSelector: 'tr[index]',
            dragEnd: function () {
                var o = $(this);
                var id = o.attr('id');
                var i = parseInt(o.attr('index'));
                var target_id = 0;
                if (parseInt(o.next().attr('index')) < i) {
                    target_id = o.next().attr("id");
                }else if(parseInt(o.prev().attr('index')) > i) {
                    target_id = o.prev().attr("id");
                }
                t.find('.next,.prev').hide();
                $.post(setting.handler, $.extend(setting.data,{
                    id: id,
                    target_id: target_id
                }), function (r) {
                    if (r.status === 1) {
                        var flag = target_id.substr(0, 1);
                        if(flag == '+'){
                            goto(setting.page + 1);
                        }else if(flag == '-') {
                            goto(setting.page - 1);
                        }else{
                            ref();
                        }
                    } else {
                        artDialog.alert(r.info);
                        i = i - 1;
                        if(i > -1)
                            o.insertAfter(o.parent().find('tr[index="' + i + '"]'));
                        else
                            o.prependTo(o.parent());
                    }
                });
            }
        }).find('tr[index] '+ setting.selector).bind('mousedown', function(){
            t.find('.next,.prev').show();
        }).bind('mouseup', function(){
            t.find('.next,.prev').hide();
        }).trigger('mouseup');
    }
    return $(this);
}