netkathir/data-table

A simple data table using pure js with client pagination

Installs: 6

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 1

Forks: 0

Open Issues: 0

Language:HTML

Type:component

1.1 2022-04-25 00:45 UTC

This package is auto-updated.

Last update: 2025-04-25 12:03:21 UTC


README

Convert existing table to paginated table, boostrap based style

Best suitable for server rendered html table.

composer require netkathir/data-table

Netkathir data table

@Example: add id to table

Add page size select box where required

     <select
        onchange="Netkathir.paging()"
        class="form-control sm"
        id="pagesize"
        style="width: 60px">
        <option selected="selected" value="10">10</option>
        <option value="25">25</option>
        <option value="50">50</option>
        <option value="100">100</option>
        <option value="500">500</option>
      </select>

add paging container where u want

<nav id="pagination"></nav>
Call paging onload (default values - you can change)
 <script>
   Netkathir.start({
     tableId: "#data-table1",
     getPageSizeFrom: "#pagesize",
     paginationContainer: "#pagination"
   });
 </script>

image

License

data-table is opensource software licensed under the MIT license.