Jump to content
  • 0

Show/Hide HTML Block in Calendar Datapage based on Filter Value



In my application I want users to be able to edit fields  for events that are associated with the current calendar year, but not past years.  I am using a Calendar DataPage that displays the events based on the filtered Year and other variables. Each event has a link that routes to a webpage that displays the event's details.

I have two links, one that directs to an editable DataPage and the other to a non-editable DataPage.  I only want to show one link per event, which is dependent on the filtered calendar year. I followed the directions in the following forum post, but the link does not hide as expected on the filtered year: 

 Calculated field (CalcField):

WHEN [@field:Event_AY] = '2022-2023'
THEN 'show'
ELSE 'hide'

First HTML Block contains URL:

<a href="#" id="link-id-[@field:Event_Table_ID]" target="_blank">Details</a>

Second HTML Block contains script:

var link = document.getElementById("link-id-[@field:Event_Table_ID]");
var htmlBlock = link.parentElement;
var entry = htmlBlock.parentElement;
var calcFieldIndex = 4;
var calcField = entry.getElementsByClassName("cbResultSetData")[calcFieldIndex - 1];

if (calcField.value !== show)
    htmlBlock.style.display = "none";

I know the calculation is working, the show/hide link just isn't working. Any insights would be appreciated.

Link to comment
Share on other sites

2 answers to this question

Recommended Posts

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.

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.

  • Create New...