Jump to content
  • 0

pmcfarlain
 Share

Question

I'd like to make the format of my list report look nicer, how can I do this? Specifically, I'd like to be able to highlight every other row of data (not data cell) and align the labels and the data so that they are directly underneath each other.

1307859877_ScreenShot2021-08-20at10_57_33AM.png.3e14c6c28e15bff8c02399dbd52727bd.png894585863_ScreenShot2021-08-20at10_57_33AM.png.1aadc939989164941f86ad91053f1afc.png

Edit: Additionally, it would be nice if I could have conditional formatting on the data so that if it is below the goal, the text turns red and if it's at or above the goal the text turns green. The data cells are using calculated fields. Is there a way I can do this conditional formatting in an HTML block that references the calculated field?

Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 1
37 minutes ago, pmcfarlain said:

I'd like to make the format of my list report look nicer, how can I do this? Specifically, I'd like to be able to highlight every other row of data (not data cell) and align the labels and the data so that they are directly underneath each other.

1307859877_ScreenShot2021-08-20at10_57_33AM.png.3e14c6c28e15bff8c02399dbd52727bd.png894585863_ScreenShot2021-08-20at10_57_33AM.png.1aadc939989164941f86ad91053f1afc.png

Edit: Additionally, it would be nice if I could have conditional formatting on the data so that if it is below the goal, the text turns red and if it's at or above the goal the text turns green. The data cells are using calculated fields. Is there a way I can do this conditional formatting in an HTML block that references the calculated field?

Something like this? 
image.png.70f023cfca0c9d318790880cdab0d40a.png

 

If yes, I added <br /> at the end of each Label

On Header:

<style>

dd{
background-color:yellow;
}

</style>

dd is for the data, dt is for labels

 

Here's script for the conditional: from https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/how-to-dynamically-change-the-background-of-a-results-page/

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


<script>


if([@field:FIELDINNUMBER] < 10){
var isi = document.getElementById("visi[@field:UNIQUEID]");
isi.style.display = 'none';
isi.parentNode.parentNode.children[5].style.backgroundColor = 'red';
}



</script>

change children number, as well. I suggest putting the HTML block at the end. use ctrl shift c then count the elements under the <dl> starting from 0. Mine is the 6th child, so, it's 5

image.png.b9e61fdfd66a5445aec0607167eb1478.png

Link to comment
Share on other sites

  • 1
8 minutes ago, pmcfarlain said:

That's great, thank you! Do you know a way to align the results? I want the numbers to be in a column like they would on a tabular report. These are calculated fields.

 2113336910_ScreenShot2021-08-20at12_44_18PM.png.ab82098c90e3d1665bfc78d85db7425b.png

it's not in a table form, so there's really no alignment here.

 

Dirty way : &nbsp;

image.png.21a6ab9fa44d30e483dc4d8bc27621d5.png

 

or use style individually

dl > dt:nth-child(){
      margin-right:15px !important;
}

 

Link to comment
Share on other sites

  • 0
55 minutes ago, TellMeWhy said:

Something like this? 
image.png.70f023cfca0c9d318790880cdab0d40a.png

 

If yes, I added <br /> at the end of each Label

On Header:

<style>

dd{
background-color:yellow;
}

</style>

dd is for the data, dt is for labels

 

Here's script for the conditional: from https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/how-to-dynamically-change-the-background-of-a-results-page/

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


<script>


if([@field:FIELDINNUMBER] < 10){
var isi = document.getElementById("visi[@field:UNIQUEID]");
isi.style.display = 'none';
isi.parentNode.parentNode.children[5].style.backgroundColor = 'red';
}



</script>

change children number, as well. I suggest putting the HTML block at the end. use ctrl shift c then count the elements under the <dl> starting from 0. Mine is the 6th child, so, it's 5

image.png.b9e61fdfd66a5445aec0607167eb1478.png

That's great, thank you! Do you know a way to align the results? I want the numbers to be in a column like they would on a tabular report. These are calculated fields.

 2113336910_ScreenShot2021-08-20at12_44_18PM.png.ab82098c90e3d1665bfc78d85db7425b.png

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...