[Feature Request] Built-in Filter Editor for v-data-table (multi-condition, per-column, with operators)
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 41k
- Forks
- 7.1k
- Avg merge
- 1d 21h
- Merged PRs (30d)
- 11
Description
Problem to solve
v-data-table currently exposes only a single global search prop and a per-call custom-filter. Anything beyond "type one string, match all columns" — per-column filtering, choosing an operator (equals / contains / starts with / is greater than / is blank…), combining multiple conditions with And/Or, nested groups — has to be rebuilt by hand in every project, usually by overriding the header slot with menus, autocompletes, or text fields. The community has produced many partial recipes for this (DEV.to "Multi Filter Column in Vuetify Data Table", several CodePens, Medium write-ups), which is itself evidence that the need is common and there is no canonical answer.
For business / LOB applications — ERP, accounting, admin panels, anything with a grid of hundreds or thousands of rows — this is a baseline expectation users bring from desktop grids. WinForms developers in particular have had the DevExpress Filter Editor for years and expect equivalent ergonomics on the web.
Reference
DevExpress Filter Editor (WinForms) — the prior art this request is modeled on: https://docs.devexpress.com/WindowsForms/2471/controls-and-libraries/data-grid/visual-elements/view-common-elements/filter-editor
Proposed solution
DevExpress Filter Editor (WinForms) — the prior art this request is modeled on: https://docs.devexpress.com/WindowsForms/2471/controls-and-libraries/data-grid/visual-elements/view-common-elements/filter-editor
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with v-data-table's existing global search prop and per-call custom-filter behavior, then compare the requested operators and nested And/Or groups with the linked DevExpress Filter Editor reference. No files, tests, or acceptance criteria are named, so agree on the API and interaction scope with maintainers first; done would require an agreed filter editor covering the requested conditions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Quiet
- Clarity
- Needs clarification
- Newbie friendliness
- 30/100