Markdown rendering in DataTable while preserving original data for filtering and CSV export

I have a Dash DataTable up and running in which I’m leaning on{'presentation': 'markdown'} in order to convert cell contents into hyperlinks and also display images for image URLs. This is working great, however when users interact with the table I really need for them to be able to filter on the original cell values rather than the Markdown strings, and similarly, when exporting the table contents as CSV, this needs to export the original non-Markdown data values.

Has anyone come up with any good strategies here?

I know that are client-side table widgets like Datatables make a distinction between rendered cell contents and underlying data to support both these needs, and I gather that Dash supports this separation of concerns via d3-format specifiers, however this works for numeric formatting, but not arbitrary string re-writing logic, meaning that the standard strategy seems to be doing Markdown transformations on the underlying data source.

So in summary, I’m not sure what the best way to try to sync derived Markdown columns from their original data columns within the DataTable component.

Just occurred to me that that one way to support to support filtering could be to switch from filter_action='native' to filter_action=custom and do all the filtering on the backend before the Markdown columns have been derived. Not ideal as I’d prefer the more responsive client-side filtering, and it also means I’d need to roll my own backend download CSV export functionality. But it could be a viable option.

Maybe the tabulator component could be an option?

Cheers @Emil, I didn’t know about DashTabulator!

Looks like a cool component that would address this specific issue. But I’m a little wary of switching from DataTable, which is under active development by the Plotly team and going all in on a different component that has a less clear maintenance status – I see it hasn’t been updated for a year now.

Will keep it in mind, but not sure if switching would be the right move for my project.

I completely understand. The maintenance status is also unclear to me. But I figured to post it anyway, as it seems to fit your use case well. Also, I think this is the way grid rendering should be. Unfortunately I haven’t found a data grid in Dash that has it all :confused:

1 Like