deliteful-list-List-categorized-list

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.min.js"></script>

JavaScript

require.config({
    baseUrl: "http://ibm-js.github.io/libraries/master/"
});
require(["deliteful-build/layer"], function () {
    require([
        "delite/register",
        "dstore/Memory",
        "dstore/Trackable",
        "deliteful/list/PageableList",
        "requirejs-dplugins/css!delite/themes/defaultapp.css",
        "delite/theme!delite/themes/{{theme}}/global.css", // page level CSS
        "requirejs-domready/domReady!"], function (register, Memory, Trackable, PageableList) {
        var Dstore = Memory.createSubclass([Trackable], {});
        var list = new PageableList();
        list.setAttribute("aria-label", "Sample pageable list with custom loader messages");
        list.source = new Dstore();
        for (var i = 0; i < 100; i++) {
            list.source.add({
                label: "item " + i
            });
        }
        list.style.height = "400px";
        list.pageLength = 9;
        list.maxPages = 2;
        list.loadPreviousMessage = "Load previous data (${pageLength} entries)";
        list.loadNextMessage = "Load next data (${pageLength} entries)";
        list.placeAt(document.body);

        document.body.style.display = "";        
    });
});