Jump to content

Hide HTML Block base on Calculated Fields


Recommended Posts

  • 2 months later...

Hi NeoInJS,

Please try the following:

  1. Create a calculated field. In this example, label it as CalcField.
  2. Put some formula in the calculated field that either resolved to some value or to NULL.
  3. Then, next to the calculated field in Step #1, create the HTML block that will contain the link.
  4. Create the HTML link inside that HTML block, with Source view enabled:
    <a href="YOUR_URL" id="link-id-[@field:YOUR_RECORD_ID]">LABEL</a>

    Please take note that the HTML link should have an ID as shown above for easy reference in JavaScript. You can also choose a different ID prefix aside from link-id-, but you have to update the script below. 

  5. Next to the HTML block from Step #3, create another HTML block with Source view enabled.
  6. Then put this script inside the HTML block from Step #5:
    <script>
    var link = document.getElementById("link-id-[@field:Lap_ID]");
    var htmlBlock = link.parentElement;
    var entry = htmlBlock.parentElement;
    var calcFieldIndex = 5;
    var calcField = entry.getElementsByClassName("cbResultSetData")[calcFieldIndex - 1];
    
    if (calcField.value !== null)
    {
        htmlBlock.style.display = "none";
    }
    </script>
  7. For the calcFieldIndex variable, please update the actual value according to the screenshot below:
  8. Calculated Field Index.png

Hope this helps.

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
Reply to this topic...

×   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...