MooTools

How to use

Similar to Mootools HtmlTable. Create a new grid by using the following command:

var grid = new AccessibleGrid({
    properties: {
        border: 1,
        cellspacing: 3
    },
    gridContainer : container,
    gridname:'Bodydata',
    headers: ['Name', 'Firstname', 'Sex', 'Height (cm)', 'Weight (kg)'],
    rows: [['Porter', 'Oliver', 'male', '172', '87'], ['Cooper', 'Jack', 'male', '145', '56'], ['Brown', 'Ruby', 'female', '189', '110'], ['Bush', 'Alfie', 'male', '175', '75'], ['Fletcher', 'Jessica', 'female', '112', '45']],

    zebra: true
});

Parameters

• properties: specify useful html properties
• gridContainer: the containing DOM element of this grid
• gridname: heading above the grid
• headers: the column headers of the grid
• rows: content of the cells in the rows
• zebra: if neighbour grid rows should be coloured differently for enhanced visibility

To integrate the grid into your site define a container

var container = $('tabl');  

and then add the grid to this container

grid.inject(container);

Sorting is also possbile.

grid.enableSort();

Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.