Conditional region contents visible in source code

[Petruchocho]

Show or Hide Elements Conditionally

Intro You can show or hide elements on your page conditionally, i.e. when a specific condition is met. There are two ways of doing in Wappler - using a conditional region and using the dynamic show and hide attributes. In this tutorial we will explain how to use both methods and what are the differenced. We have a variable on our page, and we want to show or hide an element based on its value: [Screenshot_1] The element we want to show and hide is a simple column in the layout: [Screensh…

@Teodor Thank you for your tutorial.
I was following your tutorial and wanted to hide my menu while user is not logged in.
So I have NodeJS with Header layout, I use conditional region on my container inside header and outcome was: menu was not visible, but still visible in source code.
As a condition I use data from Security provide - data.identity.
Could you please guide me - what I’m missing?

[Teodor]

Well most probably your sc_get_info.data.identity returns a value Check its response in the dev tools > network > XHR

[Petruchocho]

I was trying to step back from data.identity as a condition and set condition just to false and menu is now shown visually, but seen in source code. When condition is true - seen both visually and in source code.

[Teodor]

So you are referring to the source code of the page?
Source code will always be visible … what the conditional region does is to not render the content of the conditional region, so it’s not added to the DOM when the page loads.
You can see this by Inspecting your page using the dev tools:

[Petruchocho]

Thank for you explanation, it was misunderstanding from my side.