# layui-soul-table: filtering, column control and Excel export for the layui table

> layui-soul-table is a JavaScript extension for the layui table module that adds header filtering with custom conditions, drag-to-reorder and hide columns, Excel export that respects the current filter and column order, nested child tables, row dragging, a context menu, a totals row with fixed columns and double-click column sizing. It works as a set of drop-in files rather than a package.

**yelog/layui-soul-table** — layui-table 表头筛选、列顺序调整、列快速隐藏、excel导出等

- Repository: https://github.com/yelog/layui-soul-table
- Website: http://yelog.org/layui-soul-table
- Stars: 557 · Forks: 146
- Language: JavaScript
- License: MIT
- Published: 2026-10-22 · Updated: 2026-10-22 · Language: en
- Canonical page: https://hysenlabs.com/projects/yelog-layui-soul-table

## It is an extension of layui, not a replacement grid

layui-soul-table is a set of files you drop into an existing project to give the layui table module more capability, and the README is organised around that idea. The extension list is nine items, and they are specific enough to be useful. Header filtering with custom conditions comes first, with the note that front-end filtering is covered in one section and back-end filtering in another. Dragging columns to reorder them and hiding columns is second. Excel export is third, and the detail that makes it worth having is that the export follows the current filter conditions and column order. A child table is fourth, a table inside a table, with unlimited levels, and the child table supports the same first three features. Then come dragging rows, a right-click context menu, a totals bar that supports fixed columns, double-click to auto-size column width, and a right-side fixed column whose width can be dragged to the left of the cell. The current version is v1.9.2 and it supports layui from v2.9.13 up to v2.13.3, with a full-feature compatibility test page for layui 2.13.3 included in the repository as test-all.html. The primary language is JavaScript and the project is MIT licensed.

## Installation is copying files and defining a module alias

The quick start is unusually manual, and that is the shape of the whole project. You copy five modules into your own project. soulTable.js is the main entry point, tableFilter.js is the header filtering, excel.js is the Excel export, tableChild.js is the child table and can be used on its own, and tableMerge.js is the cell merging and can also be used on its own. The source versions live in the ext directory and the compressed versions live in docs/ext, so you choose which you copy. Then you define the entry module, which is a small layui configuration block, and you bring soulTable.css into your project, which the README says you will find in the project root. The configuration is where the module alias is set.

```js
layui.config({
}).extend({                         
```

The two paths matter. The ext directory holds the readable source, which is what you want if you intend to read or modify the extension, and docs/ext holds the built files, which is what you want for a production bundle. The project is built with webpack and gulp, and the package manifest shows the scripts, where the docs script runs a webpack dev server for the documentation site and the build scripts run gulp and then webpack for the production build.

```json
  "scripts": {
    "docs": "cross-env NODE_ENV=development webpack-dev-server --config build/webpack.docs.js",
    "build_js": "gulp build_js",
    "build_all": "gulp build_js && cross-env NODE_ENV=product webpack --config build/webpack.docs.js"
  },
```

## Using it means two changes to your table.render call

The integration with layui is deliberately small, which is what makes the extension usable on an existing codebase. There are two changes. First, in the done callback of your table.render call you add soulTable.render(this). Second, in each column that should have a filter you add filter: true, and that is what makes the filter work. The example in the README shows the whole shape, with the columns definition followed by the done callback.

```js
table.render({
    elem: '#myTable'
    ,height: $(document).height() - $('#myTable').offset().top - 20
    ,limit: 20
    ,page: true
    ,cols: [[
        {type: 'checkbox', fixed: 'left'}
    ]]
    ,done: function () {
        soulTable.render(this)
    }
});
```

The design point is that nothing about your existing table configuration changes. The same cols array, the same paging, the same fixed left checkbox column, and the extension attaches itself to the rendered table. A column without filter: true is simply not filterable, so you opt in per column. The filter parameter itself is also an object form, where the type can be a date with a format, and the README notes that the date type has been enhanced so you can filter for yesterday, this week or this month, with the bracketed format needing to match the actual data format. The dropdown menu that appears in the header can be reordered and hidden, with the items array controlling the order and visibility of the table columns, the filter data, the filter conditions, the edit conditions entry and the Excel export entry, and the bottom filter area can be hidden with a bottom flag.

## Front-end filtering works out of the box, back-end filtering does not

The README is precise about the one place where the extension stops being self-contained, and it is worth reading before you plan a filter. The three supported situations are front-end without paging, front-end with paging, and back-end paging where a url is supplied. Because the first two kinds of filtering happen in the browser, they work directly. The third case is different, because in back-end paging the front-end data is incomplete, so the server has to support it. The project states that backend support currently covers Java with the MyBatis framework, where a MyBatis interceptor has been written supporting MySQL and Oracle, and that a separate repository, layui-soul-table-java, holds the complete project with the back end included. For other languages or frameworks there is no demand at the moment, and the author invites extensions and questions. There is also a note about a bug in the layui framework itself, where giving an extreme limit value such as limit:1000000 works around it for the non-paged case, and the author offers to fix table.js directly if you would rather not do that. That last detail is a good measure of the project's character, since the workaround is documented rather than hidden.

## Excel export, child tables and the parts you can use alone

The export configuration is where the project spends most of its documentation effort on styling, and the table of options covers a default file name with a date function option, header font family, size, colour and background, the same set for cells, and a cell type indicator for boolean, number, error, string and date. The colour values are hex without a hash sign, and the README flags that constraint twice because it is the setting people get wrong. The child table is a separate feature with its own parameter set, where a show value chooses whether the child expands inside the table or appears in a popup, a where clause supplies the request parameters either as data or as a function returning data, a data clause supplies the rows, and a toolEvent binds row events, with the warning that a child event name such as edit must not be the same as the main table's or both will fire. The child table and the merge module can each be used on their own, which is the more interesting fact for an existing project, since you can take the cell merging without taking the whole extension.

## Where layui-soul-table is the wrong choice

The first limit is that this is a set of files rather than a package, and a set of files has to be copied, kept in sync by hand and re-copied when you upgrade, and the version compatibility window is narrow, from layui v2.9.13 to v2.13.3, so a layui upgrade can land you outside the supported range. The second is the back-end filter path, which is bound to Java with MyBatis and a specific set of databases, so a team on another stack is left with front-end filtering over incomplete data, which is the one case the extension explicitly does not solve on its own. The third is the coupling to layui itself, since the whole thing is an extension of a table module, so a project that has moved to another grid has no use for it at all. The fourth is the state of the project. The repository has no GitHub releases, the version in the manifest is 1.9.2 and the README names the same version, the last push was on 2026-08-17 and the repository is not archived, and there is no sign of a published changelog for the extension itself, so a version bump arrives silently and the compatibility note in the README is the only signal. The fifth is the amount of configuration the features need, since the header dropdown, the date filter format, the export styling, the child table where and data clauses and the context menu are all separate opt-ins, so a team that wants only filtering and export still has to read the documentation for the rest to know what it is not turning on.

## Conclusion

Adopt layui-soul-table if you already build admin interfaces on the layui table module and need filtering, column reordering and Excel export without leaving that look and feel. Skip it if your table layer is a different library, since this is an extension of layui and not a standalone grid, and skip it if your data is server-paginated and your backend is not Java with MyBatis, since the backend filtering path has a specific requirement. Verify first that your layui version falls in the supported range, that the filtering model you need is front-end or back-end, and that the drop-in files are copied from the right directory.

## FAQ

### How do I install layui-soul-table into a layui project?

You copy five modules into your project, soulTable.js as the main entry, tableFilter.js for header filtering, excel.js for the Excel export, tableChild.js for child tables and tableMerge.js for cell merging, choosing the source from the ext directory or the built files from docs/ext. You then define the module alias through a layui.config call, bring soulTable.css into the project, and call soulTable.render(this) inside the done callback of your table.render.

### Which layui versions does layui-soul-table support?

The current version v1.9.2 supports layui from v2.9.13 through v2.13.3, and a full-feature compatibility test page for layui 2.13.3 is included in the repository as test-all.html. The project is MIT licensed and the last push to the repository was on 2026-08-17.

### Does the Excel export in layui-soul-table respect my filters and column order?

Yes, the export is based on the current filter conditions and column order, and the export options cover a default file name that can be a function for adding the date, header font family, size, colour and background, the same set for cells, and a cell type indicator. The header dropdown also has an entry that toggles the export function on and off, and the order of the dropdown items is configurable.

## Sources

- [Issues](https://github.com/yelog/layui-soul-table/issues)
- [License: MIT](https://github.com/yelog/layui-soul-table/blob/master/LICENSE)
- [Project website](http://yelog.org/layui-soul-table)
- [README](https://github.com/yelog/layui-soul-table/blob/master/README.md)
- [yelog/layui-soul-table on GitHub](https://github.com/yelog/layui-soul-table)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/yelog-layui-soul-table