Change the background color based on value of the record in Gallery DataPage

[SunakoChan]

Hi Team,

Is it possible to change the background color based on the value of the record in the result page of the Gallery DataPage?

For example:
Admin           |   Orange
Manager      |   Yellow
User               |   Green
Public            |   Gray

[telly]

Hi @SunakoChan,

You may use this code on the HTML block of your result page in the Gallery DataPage:
 

<div id="visi[@field:User_ID#]"></div>

<script>
document.addEventListener('DataPageReady', function (event) {
var isi = document.getElementById("visi[@field:User_ID#]");

if('[@field:Role]' == 'Admin'){
isi.parentNode.parentNode.style.backgroundColor = 'rgb(237 94 74)';
}
else if('[@field:Role]'== 'Manager'){
isi.parentNode.parentNode.style.backgroundColor = 'rgb(205 241 101)';
}
else if('[@field:Role]'== 'User'){
isi.parentNode.parentNode.style.backgroundColor = 'rgb(44, 143, 152)';
}
else{
isi.parentNode.parentNode.style.backgroundColor = 'rgb(200, 200, 200)';
}
});
</script>