API Docs for: 2.10.19
Show:

oreesh-table Class

An extension of the core-table

// Can be created dynamically
var table = new OreeshTable();


<!-- Or via HTML -->
<table is="oreesh-table" box-border show-hover>
    <thead>
        <tr>
            <th is="oreesh-th" sortable>Stars</th>
            <th is="oreesh-th">Lessons</th>
            <th is="oreesh-th" sortable>Acievements</th>
            <th is="oreesh-th" sortable>Completed</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>1-2 Variable Expressions </td>
            <td>63%</td>
            <td>Yes</td>
        </tr>
        <tr>
            <td>2</td>
            <td>1-3 Variable Expressions </td>
            <td>13%</td>
            <td>No</td>
        </tr>
    </tbody>
</table>

Methods

setCustomSortMap

(
  • custom
)

Use custom sort, set custom sort map data.

Parameters:

  • custom Object

    sort map data

sortFunction

()

A function which can be overwritten to give custom sorting.

// Customize the sort for the fourth column
$('table').find('th')[3].sortFunction = function(a, b) {
    var options = ['No', 'Almost', 'Yes'];
    if (options.indexOf(a) > options.indexOf(b)) {
        return 1;
    }
    return -1;
};

Attributes

box-border

Boolean

Draws a distinct border around the perimeter of the table.

customIndex

String

A property applied to an oreesh-th th which allows the column to be sorted. It is required when multiple table-header-row

<th is="oreesh-th" custom-index="0">Stars</th>

customSort

String

A property applied to an oreesh-th th which allows the column to be sorted. A custom-sort map key can be assigned.

<th is="oreesh-th" custom-sort="testSort">Stars</th>

show-hover

Boolean

Will style the table cells when they are hovered over.

sortable

Boolean

A property applied to an oreesh-th th which allows the column to be sorted. A custom sort function can be assigned.

<th is="oreesh-th" sortable>Stars</th>