nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

how to change background color of a single row

siraj_farooq

hi, i want to know how to change background color of a single row dynamically in crosstab and want to show bar chart in such a way that each bar has different color, thanks in advance

Find more posts tagged with

Comments

kclark

Take a look at my example. I've highlighted the second row using this script.<div><pre class="_prettyXprint">function onCreateCell( cellInst, reportContext ){ counter = parseInt(reportContext.getPersistentGlobalVariable("counter")); if(counter >= 11 && counter <= 14) { cellInst.getStyle().setBackgroundColor("RGB(220,220,220)"); } counter++; reportContext.setPersistentGlobalVariable("counter", counter.toString());}</pre></div>

siraj_farooq

thanks for helping clark... but if we take your report that you have attached i want to color entire row " classic motors" then give a differnet color to "motor cycles", then row "planes" should have the same color as "classic motors" have, and "ships" the same of "motor cycles"........ and want to continue with pattern in whole report... the first two rows 2003 and quantity ordered should not be colored

siraj_farooq

if(counter >= 11 && counter <= 14) and how did you mentioned values 11 and 14 of counter and from where

kclark

From left to right, top to bottom, the cell count starts in the upper left. So if you know how many columns you are going to have in your crosstab then you can figure out what numbers to use for the counter.

siraj_farooq

i am encountring a problem that no of columns are dynamic, so i cant use the way above mentioned is there any other way so that i can change color row by row instead of cell be cell...????

kclark

I haven't tried this but you'd have to count the number of columns from the onCreate, in the attached example it'd be from "year"<pre class="_prettyXprint">var columns = parseInt(reportContext.getPersistentGlobalVariable("columns"))columns++;reportContext.setPersistentGlobalVariable("columns", columns.toString())</pre>Then use some script like this from the onCreate of the cross tab<pre class="_prettyXprint">row = 4;function onCreateCell( cellInst, reportContext ){ columns = (parseInt(reportContext.getPersistentGlobalVariable("columns")) + 1); counter = parseInt(reportContext.getPersistentGlobalVariable("counter")); rowStart = parseInt(columns) rowEnd = 20 if(counter >= (columns*row) && counter <= (((columns*row) + columns) - 1)) { cellInst.getStyle().setBackgroundColor("RGB(220,220,220)"); } counter++; reportContext.setPersistentGlobalVariable("counter", counter.toString());}</pre>Change the value of "row" to what row you want to highlight.