Data Table

This package contains distribution files required to style DataTables library for jQuery with styling for Bootstrap5. For more details

Installation
npm i datatables.net-bs5
  • For use of data table we create own custom hook with the help of datatables.net-bs5
  • The navigation path of this file are src/component/hook/useDatatable.js
  • For the use of datatable hook you want appear in your component please follow the below example code
Data Table component
import useDataTable from "../../hooks/useDatatable";

const tableData = [
{
name: "Tiger Nixon",
position: "System Architect",
office: "Edinburgh",
age: "61",
startdate: "2011/04/25",
salary: "$320,800",
},
{
name: "Garrett Winters",
position: "Accountant",
office: "Tokyo",
age: "63",
startdate: "2011/07/25",
salary: "$170,750",
}
]

const tableRef = useRef(null);
useDataTable({
tableRef: tableRef,
columns: columns.current,
data: tableData,
});

const movielist = () => {
return(
<>
    <div className="table-responsive rounded">
        <table
            id="datatable"
            ref={tableRef}
            className="table dataTable"
            data-toggle="data-table"
        ></table>
    </div>
</>
)
}
Previous Next