Jsgrid Javascript Grid Framework

group method

The method group returns an array of grid cells grouped by the indexes of the grid cells. Optionally, it can also attach events and styles to the grouped cells.

Syntax

objgrid.group(array elements, object event optional, object style optional)

Parameters

elements - An array of numbers or string "number1-number2" represents the index of grouped grid cells.

event (optional) - An object represents event types and corresponding handlers.

style (optional) - An object represents css style of the grouped grid cells.

var pggrid = new jsgrid(); 
        pggrid.init({ 
        id:"wrp", 
        rows:5, 
        columns:12, 
        width:25, 
        height:20, 
        gutter:1,
        backgroundColor: "#7fffd4" 
        }); 
var grp = pggrid.group([0,2,8,10,"12-24",26,30,32,"34-40"],
                        { "click": foo,
                          "mouseover": foo,
                          "mouseout": foo
                         },
                        { backgroundColor: "#d00000" }); 
     
function foo(e) {
    e = (e) ? e : ((window.event) ? window.event : "");
    var o = getTargetElement(e);
    if (e.type == "click"){
        alert("OK");
    }
    else if (e.type == "mouseover"){
        o.style.backgroundColor = "#eee";
    }
    else 
        o.style.backgroundColor = "#d00000";
}

Grid View