Example: Hyperlinking Database Fields

Hyperlink a field (databound control)

If you have a field in the database that contains a URL for a file or an image or an email address, you can ‘wrap’ the field with an HTML hyperlink in the Cell Editor.

<a href='<GEN:FIELDVALUE NAME="URLFieldOne"/>'>

<GEN:FIELDVALUE NAME="URLFieldTwo"/>

</a>

The FieldOne control is bound to a database field containing the linked URL used by the <a href> HTML tag.  The application user is redirected here when the link is clicked.  Note that the href attribute must use single quotes to encapsulate the linked URL since the GEN:FieldValue code generation tag requires that double quotes be used for its Name attribute.  The FieldTwo control is displayed to the application user.

Open a hyperlinked page in a new browser window

GEN:FieldValue tags can be easily made to open a browser in a new window when clicked.  The following example uses a FieldValue tag to open an Edit Record page in a new browser by setting the target to “_blank” to open the link in a new window:

<a href='<GEN:FIELDVALUE NAME="URLFieldOne"/>' target=”_blank”>

<GEN:FIELDVALUE NAME="URLFieldTwo"/>

</a>

The target attribute specifies that a new browser window is to be opened.  Any target name may be used, e.g., _blank, _self, _parent, or _top.

Using multiple fields in a hyperlink

You can place as many data-bound GEN:FieldValue code generation tags within the <a href> tag as you desire.  For example, you could display an entire name and address block as a hypertext link:

<a href='<GEN:FIELDVALUE NAME="CustomerURL"/>' target=”_blank”>

     <GEN:FIELDVALUE NAME="FirstName"/> <GEN:FIELDVALUE NAME="LastName"/>

     <GEN:FIELDVALUE NAME="Address"/>

     <GEN:FIELDVALUE NAME="City"/>, <GEN:FIELDVALUE NAME="State"/> <GEN:FIELDVALUE NAME="Zip"/>

     Customer since <GEN:FIELDVALUE NAME="CustomerDate"/>

</a>

You may also include text and other HTML within the <a href> tag.

If your database does not have a field containing the URL, then you can compose the URL using GEN:FieldValue code generation tags within the <a href> tag, e.g:

<a href='../Customers/EditCustomers.aspx?CustomerID=<GEN:FIELDVALUE NAME="CustomerID"/>'

     target=”_blank”>

     <GEN:FIELDVALUE NAME="CustomerName"/>

</a>

Example: Hyperlinking fields

Use this procedure to bind the code generation tags to their appropriate database fields:

Step 1: Place the above HTML, including <a href> tag and GEN:FieldValue code generation tag(s) in your page within a TableControl or a RecordControl via the Cell Editor.

Step 2:  In Iron Speed Designer, open the the Properties dialog for the page (Tools, Properties...), select the newly added controls and set these properties.  Be sure to select the database table name and field name for each of the newly placed tags, e.g.:

Tab

Property

Setting

 

Control name

CustomerID

Control Type

Control Type

Literal

Display

Visible

Checked

Bindings

Table

Customers

Bindings

Field

CustomerURL

This example assumes the CustomerURL field contains the URL.

Tab

Property

Setting

 

Control name

CustomerName

Control Type

Control Type

Literal

Display

Visible

Checked

Bindings

Table

Customers

Bindings

Field

CustomerName

Step 3:  In the Attributes tab, disable text pop-ups for both fields.

Tab

Pass-Through Attribute

Setting

Attributes

PopupDisplay

False

Step 4: Build and run your application.

Example: Add a ‘mailto’ to open an email window

<a href='mailto:<GEN:FIELDVALUE NAME="EmailFieldOne"/>’>

<GEN:FIELDVALUE NAME="EmailFieldTwo"/>

</a>

Note that the outer strings are enclosed in single quotes (') and the inner strings are enclosed in double quotes (").

In the example above, FieldOne is used by the <a href> tag and FieldTwo is displayed to the application user.  If you want to display something else on the page, but the link points to the file, you can replace the second GEN:FieldValue with a constant string or another field.

Step 1:  Drag two copies of the field you wish to display from the Toolbox onto your page.

Step 2:  In the Cell Editor, wrap the FieldValue code generation tags with the <a href> tags as shown above.

Step 3:  Select Tools, Properties... to open the Properties dialog.  Then select each newly added control (FieldOne, FieldTwo, EmailFieldOne or EmailFieldTwo) and set these properties for each control:

Tab

Property

Setting

Control Type

Control Type

Literal

Display

Display Format

Visible

Step 4:  Press OK to save your settings.

Step 5:  Rebuild and run your application.

See Also

Customizing Web Page Layout

Customizing Page Contents with the Cell Editor