rowspan delete rows

by ostapische

CSS

td button{font-size:12pt;padding:0}

JavaScript

// http://stackoverflow.com/questions/17604341/handle-cells-with-rowspan-when-hiding-table-rows
function createTable() {
    var cp = 7;
    var id = "testTable";
    var rc = JSON.parse('[["table-row", "red", [5, 3, 5, 1, 2, 1]], ["table-row", "white", [0, 0, 0, 1, 0, 1]], ["table-row", "blue", [0, 0, 0, 1, 1, 1]], ["table-row", "yellow", [0, 1, 0, 1, 2, 1]], ["table-row", "green", [0, 1, 0, 1, 0, 1]]]');// = getTableStructure
    var table = $("<table></table>");
    table.attr("cellpadding", cp);
    table.attr("id", id);
    var tbody = $("<tbody></tbody>");
    var tr, j, td;
    for (var i = 0; i < rc.length; i++) {
        tr = $("<tr></tr>");
        tr.css("display", rc[i][0]);
        tr.css("background", rc[i][1]);
        for (j = 0; j < rc[i][2].length; j++) {
            td = $("<td></td>");
            if (rc[i][2][j] == 0) {
                td.css("display", "none");
            } else {
                td.attr("rowspan", rc[i][2][j]);
            }
            tr.append(td);
        }
        tbody.append(tr);
    }
    table.append(tbody);
    $("body").append(table);
    return table;
}
function addRemoveButtons(table) {
    table.children().children().each(function(){
        var tr = $(this);
        var td = $("<td></td>");
        var button = $("<button></button>");
        button.html('x');
        button.on("click", function(){
            hideTr(this);
        });
        td.append(button);
        tr.append(td);
    });
}
function hideTr(button){
    var button = $(button);
    var tr = button.parent().parent();
    var trIndex = tr.parent().index(tr);
    var ts = getTableStructure(tr.parent());
    for (var i = 0; i < ts.length; i++) {
        for (var j = 0; j < ts[i][1].length; j++) {
            /*
            if (ts[i][1][j] == 0 && (i - trIndex) < ts[trIndex][1][j]) {
                ts[trIndex][1][j] -= 1;
            }
            */
        }
    }
    tr.hide();
}
function getTableStructure(tb) {
    var tbody = $(tb);
   ...