Pivot2 row conditional color

[nvalenzuela]

Hi there,

I´m trying to use this script to color an entire row triggered by a condition on a cell.

widget.on('ready', function(se, ev) {
	
	panelName = 'Valor' //Update your panel name from which color needs to spread to entire row
	
	var colIndex = -1
	$('pivot2 .pivot-scroller table tbody tr').each(function(index, trElement){ 
		if(index == 0)
		{
			$(trElement).find('td .table-grid__content .table-grid__content__inner').each(function(tdIndex, tdElement){
				if ($(tdElement).text() == panelName){
					colIndex = tdIndex
				}
			})
		}
		else{
			if(colIndex >= 0){
				bgColor = $(trElement).find('.table-grid__cell--col-' + colIndex).css('backgroundColor')
				$(trElement).find('td').each(function(tdIndex, tdElement){
					 $(tdElement).css('backgroundColor', bgColor)
				})

				$('pivot2 .table-grid--rows table tbody tr').each(function(rowIndex, rowElement){
					if(rowIndex > 0 && index == rowIndex){
						$(rowElement).find('td').css('backgroundColor', bgColor)
					}
				})
			}
		}

	})
})

It´s working but only for the first widget the second one ignores the script.

Both have the same script and if try in the opposite way the other works

Do you know what can be the reason for this behavior?

Thank you.

Best regards.

[harikm007]

Hi @nvalenzuela ,

Try below script:

widget.on('ready', function(se, ev) {
	
	panelName = 'Value1' //Update your panel name from which color needs to spread to entire row
	
	var colIndex = -1
	$('.pivot-scroller table tbody tr', element).each(function(index, trElement){ 
		if(index == 0)
		{
			$(trElement).find('td .table-grid__content .table-grid__content__inner').each(function(tdIndex, tdElement){
				if ($(tdElement).text() == panelName){
					colIndex = tdIndex
				}
			})
		}
		else{
			if(colIndex >= 0){
				bgColor = $(trElement).find('.table-grid__cell--col-' + colIndex).css('backgroundColor')
				$(trElement).find('td').each(function(tdIndex, tdElement){
					 $(tdElement).css('backgroundColor', bgColor)
				})

				$('.table-grid--rows table tbody tr', element).each(function(rowIndex, rowElement){
					if(rowIndex > 0 && index == rowIndex){
						$(rowElement).find('td').css('backgroundColor', bgColor)
					}
				})
			}
		}

	})
})

-Hari

[nvalenzuelakcl]

Thank you! now it works.

Best regards.