It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

Change the color of Table content

We are using Jira macro for representing Jira filter results to the confluence in table format.

Now we want the table Resolution should show conditionally like..is the resolution is Done then it should in Green and if it's another like unresolved then it should show in Yellow like so on. 

 

image.png

I tried to search around his and found that i need to work on the user macro but i need help to how to get the table details and so on.

If anybody has gone through this before so throw some lights on it..so it will help me to get this done. 

1 answer

0 votes
Dominic Lagger Community Leader Feb 20, 2020

Hi @Yogesh Mude 

I see only the option with javascript in the user macro. You can't change the jira macro itself. With javascript you could then just scrape the html page and change the color of the table. This wouldn't be a problem. 

But, I see another problem. You have to wait till the jira macro is fully loaded, because it loads asynchronously. That means, you have to check internally, whether the table is loaded or not. There, my know how is limited. I would google something like "jquery wait until element exist".

Hope this helped a little bit.

Regards, Dominic

HI @Dominic Lagger ,

Thanks for the response.

javascript you could then just scrape the html page and change the color of the table. This wouldn't be a problem.

I didn't get this can you elaborate or do you have some basic code for this.

It will help me a lot.

Dominic Lagger Community Leader Feb 20, 2020

The scraping is quite easy. This is just some sample code.

Find all status in the jira table (the status macro in the jira table has this class name):

document.getElementsByClassName("aui-lozenge aui-lozenge-subtle")

Then get and check the text

if (state[1].innerText) = 'TO DO') { ...

And finally set backgroundcolor in this row to red

state[1].parentNode.parentNode.style.backgroundColor = 'red'

And of course, all of this you have to do in a loop. 

But, the biggest problem you haven't solved. The asynchron load of the jira table.

Regards, Dominic

HI @Dominic Lagger ,

Thanks for the response and the basic code.

Could you please let me know where do i need to write this code ...do i need to use the html macro?

Dominic Lagger Community Leader Feb 21, 2020

No. You have to write a user macro.

In that user macro you can insert HTML oder Javascript.

This is an untested and unverified sample code

## Macro title: My Macro
## Macro has a body: Y or N
## Body processing: Selected body processing option
## Output: Selected output option
##
## Developed by: My Name
## Date created: dd/mm/yyyy
## Installed by: My Name

## This is an example macro

// HERE IS THE CODE FOR CHECKING, WHETHER THE JIRA TABLE HAS LOADED
// IF LOADED, CALL THE MYFUNCTION

<script>
function myFunction() {
var state = document.getElementsByClassName("aui-lozenge aui-lozenge-subtle");
for (var i = 0; i < state.length; i++){
if (state[i].innerText) = 'TO DO') {
state[i].parentNode.parentNode.style.backgroundColor = 'red';
}
}
}
</script>

Regards, Dominic

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Posted in Confluence

Lessons and Learnings: Six Months of Working Remote [Discussion]

Hey there, folks! For most of us, the past six months- yes, you read that right- have been a journey. More people than ever before have pivoted to working remotely, and navigating being on-scre...

8,196 views 6 6
Join discussion

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you