Properties Introduction - paulmaclean/datatables.webcomponent GitHub Wiki

Properties may be used in the following ways.

Via data-attributes set on the custom element:

<example-data-table
    data-ajax='{"url": "https://unpkg.com/@p_mac/datatables.webcomponent/test/support/data/generated.json"}'
    data-filterable='{"colIndexes":[5]}'
    data-summable='{"colIndexes":[2]}'
>
</example-data-table>

---

Through framework/library property injection. For example with lit element:

render() {
        return html`
            <example-data-table 
                .data="${sampleData.default}"
                .summable="${this.summableOptions()}"
                .filterable="${this.filterableOptions()}"
                .paginatable="${this.paginatableOptions()}"
                >
            </example-data-table>`
    }

---

By directly setting the properties through the dom.

<example-data-table></example-data-table>

const dataTable = document.querySelector('example-data-table');

dataTable.data = [{x:1, y:1}, {x:2, y:2}]
dataTable.init()