I need help with rules or conditions in a gallery report.

[DavidwDavis]

I have a basic table with records that includes a file field (image) and a status field (checkbox). I need to do a gallery report where the image only shows when the status field is checked. Is there a way to do this?

Thanks for the help.

David Davis

[CoopperBackpack]

Hello @DavidwDavis,

It seems, that the result can be achieved with JavaScript.

Please try to follow these steps:

1. Go to the Search and Report Wizard - Configure Results Page Fields page, add Header and Footer.

In the Header add CSS style that hides the image. Do not forget to disable HTML editor on the Advanced tab before pasting the code.

<style>
.u__display-none {
 display: none;
}
</style>

2. Do not add the Checkbox field and Image field to your Results page. Instead of this add the HTML block (disable HTML editor) and paste the following code into it:

<img class="image-elem" src="[@field:Image/]"></img>
<p class="checkbox-elem">[@field:Checkbox_field]</p>

In this way we add fields` values as parameters. Replace the field names with your local names. 

3. Paste this snippet of code in the Footer section (disable HTML editor before pasting).

<script type="text/javascript">
document.addEventListener('DataPageReady', hideImagesHandler);

function hideImagesHandler() {

var flagArr = document.querySelectorAll('.checkbox-elem');
var imagesArr = document.querySelectorAll('.image-elem');

flagArr.forEach(function(elem, i) {
   if(elem.innerText === 'No') {
   imagesArr[i].classList.add('u__display-none');
  }
 })
};
</script>

This code adds display:none property for the image if the Checkbox field is not checked. 

Hope this helps.

Feel free to update this thread if you have any questions or comments.

 

[CoopperBackpack]

@DavidwDavis,

I am glad to hear that solution works for you.

We can add style="display:none;" to the paragraph tag to hide Yes/No values.

Also, we can add the width to the image.

Therefore, the changes should be done only  in the HTML  block.

This is the updated code:

<img class="image-elem" src="[@field:Image/]" width="120"></img>
<p class="checkbox-elem" style="display:none;">[@field:Checkbox_field]</p>

Please test it and let me know in case you have other concerns.

 

[CoopperBackpack]

@DavidwDavis,

You are welcome. 

1) When you select the View, but not the Table to build the DataPage, this solution should work as well.

You are correct, this is the question of correct field names. 

For your convenience, please use a Picker icon to select the correct field, because in the View the syntax for the field name is following: Table_Name_Field_Name

Add Image as a File URL and Checkbox as a String.

2) Here is the example of the workaround of using Files in the Triggered Action.

 

 

 

[DavidwDavis]

CoopperBackpack,

This is working and is awesome! Here is what I need to adjust.

The words "Yes" and "No" show up in the results. If the checkbox is not checked then the word "No" shows up in the results. If the checkbox is checked then the image appears and the word "Yes" shows up. How do I get rid of these words?

Thanks for all the help.

David Davis

[DavidwDavis]

This is working perfect. Thanks! You are awesome.

I have two more questions.

• Will this process work on joined tables, as in the image is in one table and the checkbox is in another table. I'm going to experiment with this, just wondering if it makes sense. I'm thinking you just need to use the table/field names in place of the field names.
• On the topic of triggered actions. Caspio does not support assigning a file field by a triggered action. Do you know of any work-arounds?

Thanks again,

David

[DavidwDavis]

I've tried it on the joined tables and it works great. Super.

[SinJunYoung]

On 10/15/2020 at 9:03 AM, DavidwDavis said:

I have a basic table with records that includes a file field (image) and a status field (checkbox). I need to do a gallery report where the image only shows when the status field is checked. Is there a way to do this?

Thanks for the help.

David Davis

Generally, you can filter your records via this configuration: 

 

 

Learn more about how it here: https://howto.caspio.com/datapages/reports/creating-a-report-datapage/ 

 

You can also still configure even if the Report has a search function. However, the field with the status that you wanted should be set to hidden and has a default value to work. 

[futurist]

 Hi, 

Just wanna share this customization solution I came up with if you want to make gallery report datapages look more appealing: