Table Samples - InkJS

Table #1 - Markup with the configuration via data attributes

Pepper Scoville Rating
Trinidad Moruga Scorpion 1500000
Bhut Jolokia 1000000
Naga Viper 1463700
Red Savina Habanero 580000

<table id="table1" class="ink-table" data-page-size="2">
    <thead>
        <tr>
            <th data-sortable="true" width="75%">Pepper</th>
            <th width="25%">Scoville Rating</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Trinidad Moruga Scorpion</td>
            <td>1500000</td>
        </tr>
        <tr>
            <td>Bhut Jolokia</td>
            <td>1000000</td>
        </tr>
        <tr>
            <td>Naga Viper</td>
            <td>1463700</td>
        </tr>
        <tr>
            <td>Red Savina Habanero</td>
            <td>580000</td>
        </tr>
    </tbody>
</table>
<script>
    Ink.requireModules(['Ink.UI.Table_1'],function(Table){
        var table1 = new Table('#table1');
    });
</script>

Table #2 - Loading data via AJAX

<table
    id="table1" class="ink-table" data-page-size="2"
    data-endpoint="file.json" data-fields="pepper,scoville"
    data-labels="Pepper,Scoville Rating" data-sortable="scoville"
>
</table>
<script>
    Ink.requireModules(['Ink.UI.Table_1'],function(Table){
        var table2 = new Table('#table2');
    });
</script>