Highlight: True manipulates Data
When doing something like this:
{#each investorsTable.rows as row: Row}
<tr>
<td><Button class="text-xs" onclick={() => (selectInvestor(row.id, row.registrationName, row.email))}>Select</Button></td>
<td>{@html row.id}</td>
<td>{@html row.email}</td>
<td>{@html row.registrationName}</td>
</tr>
{/each}
and tablehandler is set to highlight: true
HTML formatted values are returned instead of original data values.
For example, name<u class="highlight">@gmail</u>.com
A workaround is to use the returned ID of the row and lookup the values. However, this workaround does not work if you are highlighting/searching ID field as it too will return a modified ID value.
I understand the design reasons for manipulating the data (keeping two copies is expensive) but I am wondering if there is a good work around or small mods to the library to help with issues like this
Interesting point. This feature is not great. There is probably a better way to achieve highlighting. (DOM ?). will think about it.
In the meantime, you could use the search scope to exclude "id" as a workaround https://vincjo.fr/datatables/docs/client/search/scope
search = table.createSearch(['email', 'registrationName'])
i want to search on "id" also so i have just turned off highlight for now.
Ya DOM might work. ill think about if there is a better way