DataTables
Displaying data in HTML tables is a staple display for any web application. The DataTables plugin adds advanced features to any HTML table.
DataTables for WireBootstrap brings DataTables into the WireBootstrap framework.
Installation
The DataTables for WireBootstrap library is located in wire-datatables.js. This and other other related files can be installed from the NPM package registry at@wirebootstrap/wire-datatables.
npm install @wirebootstrap/wire-datatablesDataTables for WireBootstrap will load the DataTables JavaScript file from a CDN if it's not found on the page. It will also load the DataTable CSS file from the same CDN.
Class
DataTables for WireBootstrap extends the wire.ui.component class. As such, it inherits all the base functionality of that class.
To create a new instance of the DataTables for WireBootstrap component, use the wire.datatables class.
const myTable = new wire.datatables();Render
Render the component using an HTML table element.
<table id="table" class="table table-hover table-striped"></table>
<script>
new wire.datatables().render("#table", {});
</script><wire-datatables wr-config="" css="table-hover table-striped"></wire-da<WireComponent component="wire.datatables" config={}>
<table className="table table-hover table-striped"></table>
</WireComponent><table
wire-component="wire.datatables"
v-wire-config=""
class="table table-hover table-striped">
</table><table
wire-component="wire.datatables"
[config]=""
class="table table-hover table-striped">
</table >Last updated
Was this helpful?