How to Display a Label as a Hyperlink

The following example shows how to display a label on a form as an active hyperlink. While this example displays a label as a hyperlink, you can use this example as a template for making other types of widgets widget appear as hyperlinks.

Step 1: Create a snippet file that displays a label as a hyperlink (for example, LabelURL.xhtml).

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:gwc="http://www.4js.com/GWC">

<!-- the head element is ignored -->
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Label snippet</title>
</head>

<body>
<!-- the template snippet is the content of the gwc:snippet-root element -->
 <gwc:snippet-root>
  <a gwc:content="value" gwc:attributes="href value"/>
 </gwc:snippet-root>
</body>

</html>

Step 2: In the application configuration file (.xcf file), add a SNIPPET element that specifies to use the newly-created snippet file ("LabelURL.xhtml") when the form displays a label whose style property is "LabelUrl".

<APPLICATION Parent="defaultgwc"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="http://www.4js.com/ns/gas/2.10/cfextwa.xsd">
 <EXECUTION>
  <PATH>$(res.qa.path)\howtos\LabelURL\src\4gl</PATH>
 </EXECUTION>
 <OUTPUT>
  <MAP Id="DUA_AJAX">
   <THEME>
    <SNIPPET Id="Label" Style="LabelUrl">$(res.qa.path)\mypath\src\web\LabelURL.xhtml</SNIPPET>
   </THEME>
  </MAP>
 </OUTPUT> 
</APPLICATION>

Step 3: For each label you want to appear as a URL, set the style property to "LabelUrl" (as shown in the .PER file example below):

LAYOUT (STYLE="MyStyle")
GRID g1
{
Enter a URL in the edit and click on change action
to make the URL appear as a link
[edt10 ]
[lbl01 ]
}
END
END

ATTRIBUTES
EDIT edt10=formonly.edt10, SCROLL;
LABEL lbl01=formonly.lbl01, STYLE="LabelUrl";
END

To run and test this example, you can use the sample .4GL code provided below.

MAIN

DEFINE edt10 STRING
LET edt10 = "http://www.google.com"

CLOSE WINDOW SCREEN
OPEN WINDOW w WITH FORM "sample"

INPUT BY NAME edt10 WITHOUT DEFAULTS ATTRIBUTES(UNBUFFERED)
  ON ACTION change
    DISPLAY edt10 TO lbl01
END INPUT

CLOSE WINDOW w
END MAIN