Change page in labview web UI builder

[LawrenceChong]

I have a question  (Please have a look on the attached file) :
 
There are 3 vix:
1.       Menu.vix
2.       Page1.vix
3.       Page2.vix
 
In Menu.vix, is there a way to click Page1Button to display Page1.vix on the right canvas and click Page2Button to display Page2.vix on the right canvas (Not to use Opacity and Tab control)?
 
Can HTML + JavaScirpt solve this problem ?
 
Is there a way to do the similar thing?

[malcolmsmith]

UI Builder doesn't have a navigation feature built in - you mentioned the main two workarounds, which are showing and hiding canvases by opacity, and using a tab control (possibly with the tabs offscreen or obscured by some other object, if you only want to allow navigation in some cases).

As far as HTML + JS goes:

- If Page 1 and Page 2 are completely independent, you could built each of them into a standalone application. You could use the hyperlink control in UI Builder to navigate between built apps, as you can navigate between any other HTML pages with it.

- You could do an equivalent of your Menu.vix in HTML - again if Page 1 and Page 2 were built into independent apps with UI Builder, you could switch between them with normal HTML links (and use an IFRAME or something similar to embed the UI Builder app in your overall HTML page).

To do everything in UI Builder (or if Page 1 and Page 2 depend on each other), you're limited to the opacity / tab control approaches.

[LawrenceChong]

How about if page1 and page2 are completely dependent?

[malcolmsmith]

You generally have to build all of your UI controls into a single VI in that case. You can have logic in subVIs to determine which parts are hidden and shown, and there's 2 different ways to handle the hiding / showing (opacity of canvases, tab control).

But you probably need to change your approach from 2 separate VIs (each with their own controls you want to show), into a single VI with all of the controls, that are shown at different times.