Configuring Siebel Open UI > Application Programming Interface > Methods of the Siebel Open UI Application Programming Interface >

Template Manager Class

This topic describes the Template Manager Class. This topic contains the following topics:

• About the Template Manager Class
• About Supported Template Manager Controls
• Examples Using Template Manager

The Template Manager class generates HTML for various controls, and uses the following method and syntax:

GenerateMarkup( configObject );

The GenerateMarkup method uses only one argument, that is an object. Depending on the properties present in object, Template Manager chooses the appropriate flow for the generation of the HTML. The following list describes the different properties that you can specify via configObject:

• type. Specify the type of control to generate. For a list of types, please see Table 39. When not specified, the value will default to the input field or SWE_CTRL_TEXT.
• class. Specify the class name to attach to the control. If multiple classes need to be attached, use a space-separated string. TM will also attaches pre-defined CSS class name for the control, based on the type of control being generated.
• id. Specify the ID which needs to be given to the control. Depending on the control type provided, auto generated value for ID can be attached by TM to the control if not provided.
• values. Specify the value that needs to be attached to the control.

  NOTE:  When specifying ComboBox for the type, you can specify an array of values. Also, the selected index needs to be specified with the property index.

• attrs. Specify any other attribute that should be attached to the control, in string format. For example, if you need aria attributes aria-label, aria-labelledby, and aria-describedby to be attached to the control, you would use the following code:

  "aria-label='abc' aria-labelledby='xyz' aria-describedby='123'"

This topic describes supported Template Manager controls.

The Template Manager class provides mark-up for the many types of controls required in Siebel Open UI. Table 39 lists the supported Template Manager controls.

This topic describes examples of using Template Manager. The examples in this section assume that tmplMgr is a reference to the Template Manager Object, and consts is a reference to SiebelApp.Constants object.

In this example, we use the following code make the call to the Template Manager to generate markup for a normal text field:

var markup = tmplMgr.GenerateMarkup({

type : consts.get( "SWE_CTRL_TEXT" )

});

In the this example, this is the expected HTML string begin held by the markup variable:

<input type="text" class="siebui-input " />

In this example, we use the following code make the call to the Template Manager to generate markup for with an additional className:

var markup = tmplMgr.GenerateMarkup({

type : consts.get( "SWE_CTRL_TEXT" ),

class: "siebui-align-left"

});

In the this example, this is the expected HTML string begin held by the markup variable:

<input type="text" class="siebui-input siebui-align-left" />

In this example, we use the following code make the call to the Template Manager to generate markup for with additional attributes:

var markup = tmplMgr.GenerateMarkup({

type : consts.get( "SWE_CTRL_TEXT" ),

attrs: "aria-label=\"abc\" aria-labelledby=\"xyz\" aria-describedby=\"123"

});

In the this example, this is the expected HTML string begin held by the markup variable:

<input type="text" class="siebui-input " aria-label="abc" aria-labelledby="xyz" aria-describedby="123 />

In this example, we use the following code make the call to the Template Manager to generate a combo box with multiple options, Value 1, Value 2, and Value 3:

var markup = tmplMgr.GenerateMarkup({

type : consts.get( "SWE_CTRL_COMBOBOX" ),

value: [ "Value 1", "Value 2", "Value 3" ],

index: 1 // zero based index

});

In the this example, this is the expected HTML string begin held by the markup variable:

<select class="siebui-select ">

<option>Value 1</option>

<option selected> Value 2</option>

<option>Value 3</option>

</select>

In this example, we use the following code make the call to the Template Manager to generate a hyperlink:

var markup = tmplMgr.GenerateMarkup({

type : consts.get( "SWE_CTRL_LINK" ),

src : "http://www.oracle.com",

value: "Oracle HomePage"

});

In the this example, this is the expected HTML string begin held by the markup variable:

<a class="siebui-link" src="http://www.oracle.com>Oracle HomePage</a>