Configuring Siebel Business Applications > Configuring Siebel Web Templates and Siebel Tags > Configuring an HTML Control Type >

Configuring an HTML Type

This topic describes examples of configuring an HTML type.

Configuring an HTML Type for a Control

The following example code creates a custom HTML type for the LabelRed control that displays the caption of the control in red:

<swe:htmltype name="LabelRed">

<font color="red"> <div od-property="DisplayName"/> </font>

</swe:htmltype>

Configuring an HTML Type for an Applet Mode

You use the Mode attribute of the swe:htmltype tag to define a custom format for the Base, Edit, New, and Query applet modes. If you define a mode, then the Siebel Web Engine uses the format you define only if the current show mode matches the value defined for this attribute. For example, assume you create a new HTML type named SiebelText to display a control that Siebel CRM displays in the following ways:

• As a label and a text field in Edit mode
• As read-only text in Base mode

In this example, you use the following code:

<swe:htmltype name="SiebelText">

<div od-property="Data" type="Text"/>

</swe:htmltype>

<swe:htmltype name="SiebelText" mode="Edit">

<div od-property="DisplayName"/>:&nbsp;<div od-property="Data" type="Text"/>

</swe:htmltype>

For more information, see Options to Control How the User Creates, Edits, Queries, and Deletes CRM Data.

Configuring an HTML Type when Siebel CRM Cannot Call a Method

To display a different image depending on the state of a control or list column, you can define an optional attribute of the swe:htmltype tag, such as State. You can use the following states:

• Disabled. For a control or list column that calls a method, when Siebel CRM cannot call the method on the record.
• Required. For a control or list column that is required.

For example, to display a gray button when Siebel CRM cannot call a method, add the following code in addition to the default definition described earlier in this topic:

<swe:htmltype name="MiniButton" state="Disabled">

<img src="images/graybtn_left.gif" border=0 height=15 width=2>

<div od-property="<Data>" type="Link"/>

<img src="images/graybtn_right.gif" border=0 height=15 width=2>

</swe:htmltype>

Note how Siebel CRM handles calls differently:

• If it cannot call a method with a predefined HTML type, then it does not display the control or list item.
• With a custom HTML type, it always uses the format defined in the SWF file to display the control or list item. The HTML that it creates for the following Data property when it cannot call a method is the caption of the control or list item without any href tags:

  <div od-property="<Data>" type="Link">

If Siebel CRM cannot call a method, then you can use a custom HTML type to hide a control or list column. For example, you can create the following empty swe:htmltype tag for the Disabled state:

<swe:htmltype name="MiniButton" state="Disabled"></swe:htmltype>

This code hides only the <div od-type="control"> tag or the <div od-property="<>"> tag that calls the FormattedHtml property.

Configuring an HTML Type to Indicate a Required Field

To display the SiebelText type with an asterisk (*) to indicate a required field, you can add the following example code in addition to the definitions for this type described earlier in this topic:

<swe:htmltype name="SiebelText" mode="Edit" state="Required">

*&nbsp;

<div od-property="DisplayName"/>

:&nbsp;

<div od-property="Data" type="Text"/>

</swe:htmltype>

The Siebel Web Engine uses the following order of precedence when it looks up HTML Type definitions in the SWF file:

1. Mode
2. State

It is recommended that you always create a default format definition for all custom HTML types. To create a default format definition, you define it without specifying the mode attribute and state attribute.

Using the Data Property of the OD This Tag

The Data property of the <div od-property="<>"> is similar to a macro that casts the current, custom type to one of the intrinsic types, then inserts the FormattedHtml property of the intrinsic type. To use the Data property, you add a Type attribute to the <div od-property="<>"> tag. This Type attribute names the intrinsic type. For example, use the following code to create a new type named MiniButton. This code adds a special format to the Web Engine intrinsic type named Link:

<swe:htmltype name="MiniButton">

<img SRC="images/btn_left.gif" border=0 height=15 width=2>

<div od-property="<Data>" type="Link"/>

<img src="images/btn_right.gif" border=0 height=15 width=2>

</swe:htmltype>

The following code outputs the same HTML as if the template included a separate <div od-property="<>"> tag, where the property is FormattedHtml and the HTML type of the control is the predefined Link type:

<div od-property="<Data>" type="Link">

You can only define a predefined type and not a custom type for the type attribute of a Data element.