Home > Forum > Rules, JS, SQL > JS code Tab panel

JS code Tab panel
0

Hello,

I have create a form rule JS that would color the cell in an itemList.
But when i move between tab panels, JS is not working anymore. On page loading/Refresh, it is fine.
Do you have any tips?
Thank you.



let itemList = #{BRP:151}#;
setTimeout(() => {
var itemListElement = document.getElementById(itemList.fld + "_" + itemList.id);
if (itemListElement) {
const provenientaElement = itemListElement.querySelector('th[data-key="#{SFLD:512}#_#{DCN:512}#"]');
if (provenientaElement) {
const textElement = provenientaElement.querySelector('.header-cell__content__text');
if (textElement) {
textElement.style.color = '#f7f7f7';
}
}
}
}, 300);

MVP

Hi,

the easiest way would be a HTML field, which you would put below the item list.

The content of the HTML field would be:

<script>
let itemList = #{BRP:151}#;
var itemListElement = document.getElementById(itemList.fld + "_" + itemList.id);
if (itemListElement) {
const provenientaElement = itemListElement.querySelector('th[data-key="#{SFLD:512}#_#{DCN:512}#"]');
if (provenientaElement) {
const textElement = provenientaElement.querySelector('.header-cell__content__text');
if (textElement) {
textElement.style.color = '#f7f7f7';
}
}
</script>

Whenever a tab is switched/displayed the existing "fields" are removed from the DOM and the new ones are added. Since the fields are added, to the DOM the script will be executed whenever the tab is displayed.

Best regards,
Daniel