HTML attributes (div class, role, aria-label etc) are being included in search

Mcrat

Howdy.

I'm using DataTables 1.10.16 on my website at underworldsdb.com and have noticed that my div class and other attributes are getting caught up in the search.

For example if you search d-flex nothing will be filtered out of search because every row has a div containing this class. Other words that are more likely to be searched (which also don't filter anything out for the same reason) are 'group', 'control', 'remove', 'focus', among others.

Is there a way to prevent html attributes from being included in search?

Thanks in advance,
Jason

colin

Hi @Mcrat ,

The way to go here is to use columns.render, you can specify what the data is for that column differently for display, filter and sort. So, for you, check if type === 'filter', and return the string that you want the user to be able to search for,

Cheers,

Colin

Mcrat

Hi @colin ,

Thanks for replying - just so it's clear in my head, would I get the same result as above if I added a data-filter attribute to the td below?

<td class="min-tablet-l" data-sort="Spell">
<img class="whuicon-lg" title="Spell" alt="Spell" src="img/spell-icon.png">
</td>

At the moment a search for "spell", "whuicon-lg" and "img/spell-icon.png" will all get this row to display.

So if I were to add a data-filter="zzz", would that make it so only a search for "zzz" would display the row?

colin

Hi @Mcrat ,

Yep, that's another option - this page here explains that in more detail.

Cheers,

Colin

Mcrat

Thanks for your help @colin - I've got it sorted now thanks to your info