PHPackages                             webcito/bs-table - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. webcito/bs-table

ActiveLibrary[Utility & Helpers](/categories/utility)

webcito/bs-table
================

A lightweight and user-friendly table plugin for Bootstrap, designed to efficiently manage tables in a streamlined, Bootstrap-themed web environment.

1.0.2(9mo ago)032proprietary

Since Jul 3Pushed 9mo agoCompare

[ Source](https://github.com/ThomasDev-de/bs-table)[ Packagist](https://packagist.org/packages/webcito/bs-table)[ RSS](/packages/webcito-bs-table/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (3)Dependencies (3)Versions (4)Used By (0)

bs-table
========

[](#bs-table)

**bs-table** is a lightweight and user-friendly table plugin for Bootstrap, designed to efficiently manage tables with a streamlined configuration and extensive customization options.

---

Table Options Reference
-----------------------

[](#table-options-reference)

Below is the **complete list** of options available for **bs-table** with detailed explanations for each.

---

### General Table Options

[](#general-table-options)

**Option****Type****Default****Description**`classes``stringobject``'table'``toolbar``string$``null``pagination``boolean``false`Enables/disables pagination controls.`sidePagination``string``'client'`Determines if pagination is done on `'client'` or `'server'`.`paginationVAlign``string``'bottom'`Vertical alignment: `'top'`, `'bottom'`, or `'both'`.`paginationHAlign``string``'end'`Horizontal alignment: `'start'` or `'end'`.`pageNumber``number``1`Initial page number when table loads.`pageSize``number``10`Number of rows per page.`pageList``array``[5, 10, 25, 50, 100, 200, 'All']`Dropdown options for the number of rows per page.`search``boolean``false`Adds a search bar for filtering rows.`url``stringfunction``null``data``array``null`Static array of data objects. Overrides `url` if defined.`debug``boolean``false`Enables debugging mode, which logs events and table interactions.---

### Sorting Options

[](#sorting-options)

**Option****Type****Default****Description**`sortName``string``null`Specifies the data field to sort by on table initialization.`sortOrder``string``'asc'`Default sorting order. Possible values are `'asc'` (ascending) or `'desc'` (descending).`onSort``function`Callback triggered when a column is sorted. Receives `field` and `order` as arguments.---

### Advanced Features

[](#advanced-features)

**Option****Type****Default****Description**`showFooter``boolean``false`Displays a table footer.`showHeader``boolean``true`Controls the visibility of the table header.`formatNoMatches``function`Custom HTMLMessage displayed when no matching rows are found.`showColumns``boolean``false`Displays a dropdown for toggling column visibility.`minimumCountColumns``number``1`Minimum number of visible columns when `showColumns` is enabled.`customView``boolean``false`Enables a custom rendering view for rows.`onCustomView``function`Callback function for rendering rows when `customView` is enabled.---

### Column Options

[](#column-options)

Columns are defined in the `columns` array. Each column object accepts the following options:

**Option****Type****Default****Description**`field``string`The data field to map onto this column.`title``string`Header text for the column.`sortable``boolean``false`Enables sorting for this column.`align``string``'left'`Horizontal alignment of column cells. Can be `'left'`, `'center'`, or `'right'`.`valign``string``'top'`Vertical alignment. Can be `'top'`, `'middle'`, or `'bottom'`.`formatter``function`Function to customize the rendering of cell values.`width``string`Sets the width of the column (e.g., `'100px'`).`checkbox``boolean``false`Adds a checkbox to the column for selection purposes.`radio``boolean``false`Adds a radio button to the column for row selection.---

### Events

[](#events)

`bs-table` provides rich event-driven functionalities. Below is a complete list of events:

**Event Name****Callback Parameters****Description**`onAll``eventName, ...args`Global event that listens to all table actions.`onLoadSuccess``(rows, $table)`Triggered when data is successfully loaded into the table.`onLoadError`Triggered when there is an error loading data into the table.`onPreBody``(rows, $table)`Triggered before the table body is rendered.`onPostBody``(rows, $table)`Triggered after the table body rendering is complete.`onClickCell``(field, value, row, $td)`Triggered when a specific cell is clicked.`onClickRow``(row, $tr)`Triggered when a table row is clicked.`onSort``(field, order)`Triggered when a column is sorted.`onRefresh`Triggered when the table is refreshed through the refresh button.**Example: Event Listener**

```
$('#example-table').on('click-row.bs.table', function (event, row, $tr) {
    console.log('Row clicked:', row);
});
```

---

How to Customize bs-table
-------------------------

[](#how-to-customize-bs-table)

### Example Scenario: Full Feature Setup

[](#example-scenario-full-feature-setup)

```
$('#example-table').bsTable({
    search: true,
    pagination: true,
    pageSize: 15,
    showColumns: true,
    columns: [
        {
            field: 'id',
            title: 'ID',
            sortable: true,
            align: 'center'
        },
        {
            field: 'name',
            title: 'Name',
            formatter: value => `${value}`
        },
        {
            field: 'description',
            title: 'Description',
            valign: 'middle'
        }
    ],
    onClickRow: function (row, $tr) {
        alert('Row clicked: ' + JSON.stringify(row));
    }
});
```

---

License
-------

[](#license)

**Proprietary**
Contact the author for licensing inquiries.

---

Author
------

[](#author)

**Thomas Kirsch**
Email:

###  Health Score

28

—

LowBetter than 54% of packages

Maintenance56

Moderate activity, may be stable

Popularity7

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity38

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~11 days

Total

3

Last Release

297d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/6d5f10c16b4b6bd1ac531ffc39c23c569490ec4630829511692c03ec89d36a11?d=identicon)[thomasK81](/maintainers/thomasK81)

---

Top Contributors

[![ThomasDev-de](https://avatars.githubusercontent.com/u/67106837?v=4)](https://github.com/ThomasDev-de "ThomasDev-de (82 commits)")

---

Tags

bootstrapclientconfigurationjquerypaginationservertable

### Embed Badge

![Health badge](/badges/webcito-bs-table/health.svg)

```
[![Health](https://phpackages.com/badges/webcito-bs-table/health.svg)](https://phpackages.com/packages/webcito-bs-table)
```

###  Alternatives

[serhioromano/bootstrap-calendar

Bootstrap full view calendar.

3.0k5.9k2](/packages/serhioromano-bootstrap-calendar)[mapbender/mapbender

Mapbender library

10117.4k5](/packages/mapbender-mapbender)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)