Some widgets are translated differently in HTML depending
on the eSpace
screen rendering mode.Service Studio 5.1 Help
Widgets and HTML Tags
Internally the widgets of your eSpace are translated, at runtime, into HTML tags according to the definition of the widget. This information might be relevant if you want to add JavaScript functions that need to handle these HTML objects.
Some widgets are translated differently in HTML depending
on the eSpace
screen rendering mode.
The widgets are translated into the following HTML tags:
<input type="submit" id="widget id" [disabled="disabled"] extended properties>
The disabled
attribute is added if the Enabled property
of the widget is false.
The special class Is_Default is added to the input class attribute when the Is_Default property of the widget is true.
<td [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed.
<input type="checkbox" id="widget id" [checked="checked"] [disabled="disabled"] extended properties>
The checked
attribute is added if check box is checked and the disabled
attribute is added if the Enabled property
of the widget is false.
<div [id="widget id"] extended properties>
If the widget has no name,
the id attribute is removed.
<table id="widget id" extended properties>
Within the Edit Record table, the special class MandatoryValue is added to all cells that hold mandatory attributes. Likewise the special class MandatoryCaption is added.
<span [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed. Ultimately, if no other attributes are required,
the span tag is also removed.
No representation in HTML.
<img id="widget id" extended properties>
<input type="file" id="widget id" size="<Width property>" [disabled="disabled"] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
<input type="password" id="widget id" size="<Width property>" maxlength="<Max. Length property>" [readonly="readonly"] extended properties>
The readonly
attribute is added if the Enabled property
of the widget is false.
The special class Mandatory is added to the input class attribute when the Mandatory property of the widget is true.
The special class Not_Valid is added to the input class attribute when the Valid runtime property of the widget is false.
The translated HTML depends on the Height property:
Height = 1
<input type="text" id="widget id" maxlength="<MaxLength property>" size="<Width property>" [readonly="readonly"] extended properties>
Height > 1
<textarea id="widget id" rows="<Height property>" cols="<Width property>" [readonly="readonly"] extended properties>
The readonly
attribute is added if the Enabled property
of the widget is false.
The special class Mandatory is added to the input class attribute when the Mandatory property of the widget is true.
The special class Not_Valid is added to the input class attribute when the Valid runtime property of the widget is false.
<a id="widget id" title="<Title property>" [disabled="disabled"] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
The special class Is_Default is added to the input class attribute when the Is_Default property of the widget is true.
<select [multiple="multiple"] [disabled="disabled"] extended properties>
The multiple attribute is
added if the Selection Mode property is
Multiple also, the disabled attribute is
added if the Enabled property of the widget
is false
<span [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed. Ultimately, if no other attributes are required,
the span tag is also removed.
<input type="radio" id="widget id" [disabled="disabled"] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
<tr [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed.
<select id="widget id" [disabled="disabled"] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
<table id="widget id" extended properties>
<table [id ="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed.
<table id="widget id" extended properties>
<span [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed. Ultimately, if no other attributes are required,
the span tag is also removed.
<input type="submit" id="widget id" [disabled] extended properties>
The disabled
attribute is added if the Enabled property
of the widget is false.
The special class Is_Default is added to the input class attribute when the Is_Default property of the widget is true.
<td [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed.
<input type="checkbox" id="widget id" [checked] [disabled] extended properties>
The checked
attribute is added if check box is checked and the disabled
attribute is added if the Enabled property
of the widget is false.
<div [id="widget id"] extended properties>
If the widget has no name,
the id attribute is removed.
<table id="widget id" extended properties>
Within the Edit Record table, the special class MandatoryValue is added to all cells that hold mandatory attributes. Likewise the special class MandatoryCaption is added.
<span [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed. Ultimately, if no other attributes are required,
the span tag is also removed.
No representation in HTML.
<img id="widget id" extended properties>
<input type="file" id="widget id" size="<Width property>" [disabled] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
<input type="password" id="widget id" size="<Width property>" maxlength="<Max. Length property>" [readonly] extended properties>
The readonly
attribute is added if the Enabled property
of the widget is false.
The special class Mandatory is added to the input class attribute when the Mandatory property of the widget is true.
The special class Not_Valid is added to the input class attribute when the Valid runtime property of the widget is false.
The translated HTML depends on the Height property:
Height = 1
<input type="text" id="widget id" maxlength="<MaxLength property>" size="<Width property>" [readonly] extended properties>
Height > 1
<textarea id="widget id" rows="<Height property>" cols="<Width property>" [readonly] extended properties>
The readonly
attribute is added if the Enabled property
of the widget is false.
The special class Mandatory is added to the input class attribute when the Mandatory property of the widget is true.
The special class Not_Valid is added to the input class attribute when the Valid runtime property of the widget is false.
<a id="widget id" title="<Title property>" [disabled] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
The special class Is_Default is added to the input class attribute when the Is_Default property of the widget is true.
<select [multiple] [disabled] extended properties>
The multiple attribute is
added if the Selection Mode property is
Multiple also, the disabled attribute is
added if the Enabled property of the widget
is false
<span [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed. Ultimately, if no other attributes are required,
the span tag is also removed.
<input type="radio" id="widget id" [disabled] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
<td [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed.
<select id="widget id" [disabled] extended properties>
The disabled attribute is
added if the Enabled property of the widget
is false.
<table id="widget id" extended properties>
<table [id ="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed.
<table id="widget id" extended properties>
<span [id="widget id"] extended properties>
If the widget has no name
and there are no extended properties, the id
attribute is removed. Ultimately, if no other attributes are required,
the span tag is also removed.
Most of the widgets have style properties. These styles
are translated into HTML class attributes for HTML elements. The layout
of all HTML classes (e.g. Mandatory) can be customized.
Please consider the following issues regarding both the HTML id attribute and the widget runtime property Id, in this topic called widget id:
The value of the id attribute of the HTML tag, when applicable, is the widget id of the desired widget, for example, wtInput10345.
Inside List Records widgets and Table Records widgets, the widgets' widget id has a different value for each row. Thus, at runtime, when you iterate such list widgets, for the same widget placed inside them, you'll obtain one different widget id per occurrence.
Similarly, inside a Web Block widget, the widget id of its elements is not always the same, it depends on the web screen where the web block is being used.
The widget id of widgets placed inside List Records or Table Records widgets is visible everywhere in the screen but, when used outside the list widgets that contain it, it returns an empty value.
See Also