eblondel
commented
6 months ago Author: Emmanuel Blondel @eblondel Date of creation: 2022-04-15T08:48:56.841+0000 Last update: 2022-04-15T08:48:56.841+0000
[~brian.ojok] [~alexandre.bennici@fao.org] For your information, see how i've implemented this, applied to the vessel list module. The objective was to make possible dropdown filters in the datatable (for each column) together with the rendering of custom html markup within the table cells (with custom color, icon, etc); AND the display of i18n. DT makes possible the display of markup through JS renders, but it would have prevented from using i18n terms (which are not handle at js level but at R level);
The solution designed relies on substituting the default dropdown filters by a new dropdown (that in addition we implement with select2 which improves display).
Look at the vessel_list to understand how it works, as we may have to recycle it elsewhere:
- change from shiny::renderDataTable to use DT::renderDT
- use arg "container", that we fill with the html table markup structure and header. For that i've created a simple ui_util called
initDTContainerthat takes a data.frame as input. - a call of 'initComplete' data.table option, where we call a Javascript function that will invoke data.table JS API, and configure the new select2 dropdown lists with specific rule to get text label only the content is a html markup
Notes:
- the 'filter' which is the default dropdown filter option has to be kept, to avoid some UI glitch on column headers at table rendering. You can comment it just to see the glitch
- Javascript codes: i've added a js_utils.R, the first function allows to read a Javascript file and make it available for other js handlers. With this approach, whatever JS code we have to use is maintained in a proper way, rather directly as character vector in R code.
If you have questions, let me know
with first application to vessel list.
This may facilitate somehow the fix of a recent regression we have on the filter dropdown feature of DT. Normally, to enable controlled-terms filtering, we have to factorize the columns. With recent work on enabling custom rendering (including html snippets with icon etc) of column values, this stopped working. The fix is particularly complex we can't really use JS renderers, because we need to rely on the output of i18n function which is on R side and not JS side.
This should also recycled/implemented in other modules where needed. cc [~brian.ojok] [~alexandre.bennici@fao.org] for information, other JIRAs will follow on this respect
This ticket is based on https://stackoverflow.com/questions/71035860/make-a-nicer-looking-dropdown-filter-label-with-datatables-dt-in-r