Conditional Coloring based on PIVOT Dimension (not value)
Hi All,
I am looking for a way to color the entire row of a PIVOT table based on specific dimension criteria.
The default feature in the PIVOT table is to apply conditional coloring for a value. However, I would like to apply conditional coloring based on the value of a dimension in the pivot table (in this example: name of the row item).
Does anyone have experience with a widget script to color the entire row of the table based on specific row criteria?
Example: I want to color the entire row EBITDA in grey (see screenshot attached).
Note: I am not looking to use the alternating rows/subtotal design feature from the widget itself.
First disable alternative rows on the pivot table then you can do this (it works but just to give you the idea)
widget.on('domready', function(se, ev) { //data grid var rows = $('.pivot-container .table-grid--data .table-grid__row', element).not('.table-grid__row-0'); //get all the cells of the column var ix = 0; rows.each(function() { do_row($(this), ix); ix++; }); function do_row(row, ix){ var color = 'cyan'; var row_el = $(row); var c0 = row_el.find('.table-grid__cell--col-0 .table-grid__content__inner'); //name var c1 = row_el.find('.table-grid__cell--col-1 .table-grid__content__inner'); //value if(c1.text() == '1,001'){ console.log(c1.text(), color) //change the color of the row row_el.css("background-color",color); //fixed grid $('.pivot-container .table-grid--fixed .table-grid__row-' + (ix + 1)).css("background-color",color) } } });
This will do bg color for the entire row, beware of pagination as the row has not been rendered yet this may not work.