table表格支持拖拽

支持拖拽的插件支持


数组中的元素是表格中td的类名
加载表格结束后 调用setTableWidth();即可

 // 支持拖拽
var keyList = [ "goal_sortNum", "goal_name", "goal_nature", "goal_target",
            "goal_unit", "goal_weight", "goal_startDate", "goal_dueDate",
            "goal_completionSituation", "goal_progress", "goal_opertion","goal_unfinishedReason","goal_improvePlan" ];
    function setTableTdWidth() {
        colWidthMap = JSON.parse(localStorage.getItem("draftGoalPage"));
        if (colWidthMap == null) {
            colWidthMap = {};
        }
        if (colWidthMap["goal_sortNum"] == undefined) {
            colWidthMap["goal_sortNum"] = 30;
            //colWidthMap["perspect_name"] = 15;
            colWidthMap["goal_name"] = 150;
            colWidthMap["goal_nature"] = 50;
            colWidthMap["goal_target"] = 100;
            colWidthMap["goal_unit"] = 50;
            colWidthMap["goal_weight"] = 50;
            colWidthMap["goal_startDate"] = 50;
            colWidthMap["goal_dueDate"] = 50;
            colWidthMap["goal_completionSituation"] = 100;
            colWidthMap["goal_progress"] = 50;
            colWidthMap["goal_opertion"] = 50;
            colWidthMap["goal_unfinishedReason"] = 100;
            colWidthMap["goal_improvePlan"] = 100;
        }

        var countWidth = 0;
        $(keyList).each(function(i, v) {
            if ($("." + v).css("display") != "none") {
                countWidth += colWidthMap[v];
            }
        })
        $(keyList).each(
                function(i, v) {
                    if ($("." + v).css("display") != "none") {
                        $("." + v).css("width",
                                colWidthMap[v] / countWidth * 101.5 + "%");
                    }
                })
        $(".JCLRgrips").remove();
        var onSampleResized = function(e) {
            var columns = $(e.currentTarget).find("th");
            columns.each(function(i, v) {
                if ($(this).attr("class") == undefined
                        || $(this).attr("class").split(" ")[0] == "goal_addTh"
                        || $(this).attr("class").split(" ")[0] == "needHide") {

                } else {
                    colWidthMap[$(this).attr("class").split(" ")[0]] = $(this)
                            .width() + 39;
                    //colWidthMap[$(this).attr("class").split(" ")[0]] = $(this).width()+$(this).css("padding-right")+$(this).css("padding-left")+1;
                }
            })
            //localStorage.clear();
            localStorage.removeItem("draftGoalPage");
            localStorage.setItem("draftGoalPage", JSON.stringify(colWidthMap));
        };
        $("#tableList").colResizable({
            liveDrag : true,
            //postbackSafe: true,
            partialRefresh : true,
            dragCursor : "e-resize",
            //resizeMode:"fit",
            //flush:true,
            //fixed:true,
            minWidth:69,
            gripInnerHtml : "
", draggingClass : "dragging", onResize : onSampleResized }); }

你可能感兴趣的:(table表格支持拖拽)