How To Use The Hyperlink And Box Hyperlink Xmpro App Designer Toolbox

In this video, you’ll learn how to set up hyperlinks and box hyperlinks to allow your app users to navigate to different pages in your app or custom URLs.

Need help with creating your XMPRO...


In this video, you’ll learn how to set up hyperlinks and box hyperlinks to allow your app users to navigate to different pages in your app or custom URLs.

Need help with creating your XMPRO... welcome to another training video from

XM pro today we will be looking at

hyperlink and box hyperlink control

hyperlink controls basically fall under

the category called action controls in

the action category allow you to

navigate from one page in your app to

another or to an outside URL altogether

so let's say I want this page to

navigate to a details page to achieve

that let's start by just adding some

layout controls where I will drag in a

hyperlink control and just make it look

nice I'll apply some of flex options

here there we go now I have a hyperlink

on the page but of course it's not

configured so what options does it alone

if I go to it's block properties in

appearance the first thing I can see is

its text so I can call it let's say help

page and let me also change that to be

now that text that it is displaying over

there can also be bound right now I

wasn't specified a static value but if I

change this as you would have seen in

how to use it their source video you can

apply a dynamic value which is being

loaded from your data source over here

for this video I will skip that I'll go

next to the action part where I have an

option to choose what I want this

hyperlink to do so it should navigate to

a landing page which is the landing page

in this app

or page any page other than the landing

page or a URL so let's say I choose URL

it will then ask me to specify that URL

which again I can either provide a

static value or bind it to a datasource

which might be available over there so

in this case I will choose just a static

value like that and I can also choose

that that navigation happens in a new

window now if I save it and launch it I

have a page which has a hyperlink and

clicking on it opens another page let's

go back and try a few other things let's

say I want this hyperlink to actually

navigate to another page in my app so

let's say the details page you know

we can figure this hyperlink to say

let's say another action and instead of

navigating to a URL I will this time

choose a page when I choose page it

shows me another drop-down with all the

pages in my app let's say I want to go

to s an details when I click Save and

launch this app I have another hyperlink

clicking on that takes me to the next

page which is asset details

now one last option that I have with

this page is over absolute the hyperlink

is that I can not only navigate but as

part of navigation I can send some

values or parameters across so I have

another page created here called asset

details with parameter and that page

expects an asset ID which again I can

either specify it a static value or a

dynamic value let's say I want to

specify a static value which is first -

that now if I apply after saving my

changes clicking on this will take me to

another page which had that parameter

bound to the title and you can see my

parameter has come through and that

value is shown over there now another

option that is available is that you can

not only display text in a hyperlink but

also display other content so let's say

I wanted to make my gauge or an image

clickable how would you do that

hyperlink only allows you to put text

and text in it so you would notice there

is another option

I'm under actions called box hyperlink

you can use that by dragging it in and

then you can put any control inside it

and that whole control will become

clickable for example let's let's drag

gage in it and let's configure that

hyperlink to actually take us

to the same asset details page and let's

also apply on that hyperlink some

styling so that it has a cover style for

example when when user hovers over it

you want it to have a gray background

and gives a better effect right now if I

save and launch this one you can see I

have a gauge on which when I hover there

is the background color and clicking on

it takes me to that to the other page so

that's how you use a hyperlink or a box

hyperlink control in app designer thank

you so much for watching

Last updated