How to hide a button on portal page when the page loads and display it later when clicked on other button

Question

I am pretty new to CRM and Portals.

I want to know how to hide a button on portal page when the page loads and display it later when clicked on other button.

I have created these buttons on my Entity list as I am displaying view from an entity on portal.

Answer 1

You can use a css, javascript or jquery in this kind of instances for example this code might help you. I set the button to appear slowly after a delay of 3 seconds.

 setTimeout(function(){ var x = document.querySelector('.hidden-btn'); x.style.WebkitTransition = "all 2s" // for safari. x.style.transition = "all 2s"; // for chrome. x.style.opacity = 1; // you can either use opacity or block }, 3000); // 3000 is equivalent for 3 seconds

 .hidden-btn{opacity: 0;} /* you can either use opacity or display: none here */

 <button class="hidden-btn">Hidden Button</button>

Answer 2

I would just use jQuery to show the initially hidden button when another button is clicked. Set to hidden from the start with css and then show it whenever you want using the jquery.show() function.

The number in the.show() function is the speed for showing the button. 1000 = 1 second. If you want it to show instantly just take the number out.

Good luck.

 $(document).ready(function() { // show the hidden button when another button is clicked. $("body").on("click", ".showHiddenButton", function() { $("#hiddenButton").show(1000); }); });

 #hiddenButton { display: none; background: orange; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button id="hiddenButton">INITALLY HIDDEN BUTTON</button> <button class="showHiddenButton">Show Hidden Button</button>