Custom HTML
By using a custom HTML item, you can add HTML code to a coach or coach view.
The custom HTML item can contain one or more sets of HTML elements
such as <div> and <label> tags.
You can add the HTML code directly as text by using a managed file
or by using a variable. The custom HTML item inserts the elements
inside the <div> tag of the coach or coach view.
If you are using a custom HTML item in a container such as the table,
tab, horizontal section, and vertical section stock controls, wrap
the HTML code in a <div> tag. By wrapping the
HTML code, the container treats all the HTML code as one entity.
Note: When
building Coaches using custom HTML blocks, ensure that the HTML segments
within these blocks are not too large. Custom HTML blocks are designed
for use with small to moderate-sized HTML segments. If you provide
an HTML segment that is too large, you might see a stack overflow
exception. In this case, you should reduce the size of the HTML segment
that you are using within your Coach. See Configuring
the JVM in the WebSphere Application Server product information.
Restriction: If your custom HTML item is within a repeating
control such as a table or section, do not bind it to a variable that
is a property within a list item. Normally, the code generator inserts
the custom HTML contents as HTML code when it creates the page. However,
repeating controls are bound to a list. Because the list contents
are not set until runtime, the code generator cannot determine the
index of the variable in the list when it creates the page. If you
want text that changes dynamically, consider using a control such
as Output Text that is bound to the variable.
Important: Do not use the following names as CSS class names
in your HTML source code because they are reserved names:
- CoachView
- ContentBox
The custom HTML item supports the use of JavaScript variables for simple types. When the server generates the HTML page for the client, it replaces the variable name with its value. However, after the server generates the page, it does not update the HTML if there is a change in the value. The server updates the variable only when it regenerates the entire HTML page. If the server cannot resolve the variable, users see the variable name instead of its value.
In the code, you wrap the variable in double curly brackets. For
coaches, the variable can refer to the data in the tw.local namespace
only. That is, the variable can refer to the data that is defined
in the Variables page of the human service under
the local node. For example, a coach has a user business
object variable with a name parameter that contains
the name of the user. You can have the coach display the name with
the following code in an HTML item:
<div>Hello, {{tw.local.user.name}}.</div>
For coach views, the variable can refer to the data in the tw.businessData or tw.options namespaces.
That is, the variable can refer to the data that is defined in the Variables page
of the view under the Business Data or Configuration Options nodes.
For example, if you want to have a view display the name of a street,
you bind the view to a address business object with
a parameter named street. In an HTML item, you add
the following code:
{{tw.businessData.address.street}}
If
you place an instance of that view into a coach, the user sees the
value of the street parameter in the view. However,
if the user updates the street parameter, the contents
in the HTML item do not update until the server regenerates the entire
page.Tip: To insert a script, add the script using inline
scripts on the Behavior page of the view. Do
not add the script using a custom HTML item.