Skip to content

[Feature Request] DataTable component - highlight search results #20357

Description

@ioptrv

Problem to solve

I'm using the Vuetify v3 DataTable component to show the contents of a relatively small array of objects, therefore its local filter/search functionality works perfectly for me. However, each object in this array contains a property with a lot of text in it. When I search for a word and the DataTable component filters out only the rows containing this word in any of the columns/properties, I can't see exactly where the word was found - so I would like to highlight this word with the yellow background everywhere it's present. The official documentation doesn't mention a property or a method to do something like this, so I guess it is a feature request.

Proposed solution

Add a new property which could me mapped to the search string (or any other variable really) and an optional object of options to specify the formatting for the highlighted area: background color, font-weight and font-decoration

Metadata

Metadata

Assignees

Labels

Type

No type

Fields

No fields configured for issues without a type.

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions