Getting hyperlinks right in Webfacing

If you've ever added a hyperlink to a character field in WebFacing, you may well have seen links with an underline extending beyond the actual text if the field's value doesn't take up the entire length of the field.

There are a couple of ways of addressing this - the first is obviously to change your stylesheet so that hyperlinks are denoted with something other than an underline - changing the colour or making the text bold.

The following change to the css will make your hyperlink dark blue for example...

a, a:link, a:visited {
text-decoration: none;
color: #3F73A6;
}

We don't always have the luxury of being able to style the underline away from our hyperlinks though. The customer's requirements and in-house standards might well dictate that they want the hyperlinks to be underlined.. and they don't want a mess!

Select Web Settings > HTML Overrides
Check the 'Override generated HTML' checkbox and select the 'Insert' radio button.

Select the "Before" tab and enter the following code, replacing the with the values that are pertinent to your application:

<% if (!isProtected) { %>
<a href="#" onclick="<javascriptCode>"><%=<recfmt>.getFieldValueWithTransform("<field>",QUOTED_TRANSFORM).replaceAll("( )*$", "")%>
<% } else { %>
<%=<recfmt>.getFieldValueWithTransform("<field>",rrn,QUOTED_TRANSFORM).replaceAll("( )*$","")%>
<% } %>

<javascriptCode>- Specify the javascript code that you want to be executed when the link is clicked.
<recfmt>- The record format with the field that you want to turn into a hyperlink
<field> - The field name that you want to turn into a hyperlink (bear in mind that Webfacing translates certain characters (e.g. '#') into replacement values)

In the "inside" tab, enter the value ' style="display:none" '