Geek Answers Handbook

Complex javascript and jquery merge algorithm

I have a rather unique problem that I'm having problems with. I have a 2 x 3 table located as shown below.

    _1 ____ 2__
1- | ____ | ____ |
2 | ____ | ____ |
3 | ____ | ____ |

Data is populated in table cells. Sometimes the data in a column or row may be the same. For example, if (1,1) and (1,2) have the same data. In some cases, (1,1), (1,2) and (1,3) may have the same data. If the values ​​in the cells are the same and adjacent, they must be combined. For example, if (1,1) and (1,2) both have the value "100", the two cells are combined. I did it manually using jquery, for example:

(1,2).hide();
(1,1).attr("rowspan", "2");

I hide the (1,2) cell instead of delete, since the tables can be reset to the original 2x3, and then re-populated if necessary. In manual mode, this works fine, but I need a dynamic method. The following is a general goal of what needs to be accomplished.

  • If two vertically adjacent cells or three vertically adjacent cells in their respective columns have equal values, then these cells are combined together.
  • , (1,1) (2,1), .
  • , , , {(1,1), (1,2)}, {(1,1), (1,2), (1,3)}, ((1,2), (1,3)}, {(2,1), (2,2)}, {(2,1), (2,2), (2,3)}, { (2,2), (2,3)}
  • . : {(1,1), (1,2)} , {(2,1), (2,2), (2,3)} . .

: , . - , ? , , . . !

+5
2

? http://jsfiddle.net/4zGvg/ /.

: values span. span

0 =

1 =

x > 1 = rowspan x

. - , span span :

for (var col = 0; col < cols; col++) {
    for (var row = rows - 2; row >= 0; row--) {
        if (values[row][col] == values[row + 1][col]) {
            span[row][col] = span[row + 1][col] + 1;
            span[row + 1][col] = 0;
        }
    }
}

, span / rowspan.

+3

2x3, .

http://jsfiddle.net/Csxbf/

var $cells = $("td");

if ($cells.eq(0).text() == $cells.eq(2).text()) {

    if ($cells.eq(2).text() == $cells.eq(4).text()) {
        $cells.eq(2).hide();
        $cells.eq(4).hide();
        $cells.eq(0).attr("rowspan",3);
    } else {
        $cells.eq(2).hide();
        $cells.eq(0).attr("rowspan",2);
    }

} else if ($cells.eq(2).text() == $cells.eq(4).text()) {
    $cells.eq(4).hide();
    $cells.eq(2).attr("rowspan",2);
}

, . eq . .

, , rowspan. , .

+2

More articles:


All Articles