handsontable合並項mergeCells應用及擴展

由於我這個項目主要是配置多表頭信息，主要使用了handsontabel合並項功能。

但是，在該功能使用過程中發現了一些問題和一些自己根據需要做的一些擴展

---

    $("#topFieldDiv").handsontable({
        data: data,
        colHeaders: colHeadArr,//設置列頭
        manualRowResize: true,//自定義行寬
        manualColumnResize: true,//自定義列高
        manualColumnMove: true,//是否能拖動列
        //manualRowMove: false,//是否能拖動行
        columnSorting: false,//false/對象 //當值為true時，表示啟用排序插件
        //rowHeaders: false,//是否顯示行數字
        contextMenu: true,//右鍵顯示更多功能,
        columns: cols,
        autoColumnSize: true,
        mergeCells: setmergeCells //加載合並項。變量名setmergeCells不能與mergeCells命名一樣
    });

這里特別說明下：變量名setmergeCells不能與mergeCells命名一樣。一開始變量名取為 mergeCells，沒有加載出合並項 被坑了一下

一、獲取合並項信息。mergeCells.mergedCellInfoCollection

var $container = $("#topFieldDiv");
var handsontable = $container.data('handsontable');//獲取當前handsontable

var data = handsontable.getData();//獲取所有值
var mergeCellArr = handsontable.mergeCells.mergedCellInfoCollection;//獲取合並項目

對handsontabel進行了一系列的合並操作之后，可以通過 xx.mergeCells.mergedCellInfoCollection獲得合並項結果。

mergedCellInfoCollection為一個集合，格式如下：

[{"row":0,"col":0,"rowspan":1,"colspan":3},{"row":0,"col":3,"rowspan":1,"colspan":3},{"row":0,"col":6,"rowspan":1,"colspan":3}]

二、擴展方法 IsMergeMainCell（判斷是否為合並單元格主項）

//判斷是否為合並單元格主項
//i->行坐標
//j->列坐標
//mergeCellArr->合並項集合
function IsMergeMainCell(i, j, mergeCellArr) {
    var bool = false;

    if (mergeCellArr != null && mergeCellArr.length > 0) {
        for (var k = 0; k < mergeCellArr.length; k++) {
            var curMerCell = mergeCellArr[k];
            if (i == curMerCell.row && j == curMerCell.col) {
                bool = true;
                break;
            }
        }
    }
    return bool;
}

三、擴展方法 GetParentName （獲取單元格的合並項父級的值）

//獲取單元格的合並項父級的值
//i->行坐標
//j->列坐標
//mergeCellArr->合並項集合
//handsontable->
function GetParentName(i, j, mergeCellArr, handsontable) {
    var parentName = "";
    if (mergeCellArr != null && mergeCellArr.length > 0) {
        for (var k = 0; k < mergeCellArr.length; k++) {
            var curMerCell = mergeCellArr[k];
            if (curMerCell.row <= i && i <= (curMerCell.row + curMerCell.rowspan - 1) &&
                curMerCell.col <= j && j <= (curMerCell.col + curMerCell.colspan - 1)) {
                parentName = handsontable.getDataAtCell(curMerCell.row, curMerCell.col);
                break;
            }
        }
    }
    return parentName;
}

四、對表格經歷了一番合並、行的刪除之后，再次獲得合並項集合時，會出現已刪除的行合並項仍然存在，與實際合並項信息混雜一起難以區分。

對原生handsontabel的刪除行（remove_row）方法做了修改：在每次刪除行的同時，從合並項集合中清理掉屬於該刪除行的合並項。修改內容如下：