THIS IS A TEST INSTANCE. ALL YOUR CHANGES WILL BE LOST!!!!
Page History
...
High
...
level
...
requirement
...
User
...
should
...
be
...
able
...
to
...
rollover
...
tooltip
...
indicator
...
to
...
have
...
content
...
explain
...
requirements
...
of
...
the
...
input
...
field
...
it
...
is
...
displayed
...
in.
Details
The tooltip will be dynamically populated with content to be pulled via xml files that are configured by the documentation team. Special tags will be placed in the the documented xml files and pulled from the tooltip to display the information.
Technical details
Add a tooltip to form fields, which display relevant documentation for that field on focus of the input/select box.
Create a JSON 'lookup table' for the documentation, which is organized by a new field ID.
It is in a basic object map format:
| No Format |
|---|
h2. *Details* The tooltip will be dynamically populated with content to be pulled via xml files that are configured by the documentation team. Special tags will be placed in the the documented xml files and pulled from the tooltip to display the information. h1. Technical details Add a tooltip to form fields, which display relevant documentation for that field on focus of the input/select box.\\ Create a JSON 'lookup table' for the documentation, which is organized by a new field ID.\\ It is in a basic object map format:\\ <pre> cloudStack.docs = { <fieldID>: { desc: '<Content of the tooltip>' } }\\ </pre> The tooltips only support fields generated by the createForm (form builder) widget. To show a tooltip for a field on focus, add a new option, 'docID' to the field object.\\ For example, for the 'name' field on the add volume form, the doc JSON looks like this:\\ |
The tooltips only support fields generated by the createForm (form
builder) widget. To show a tooltip for a field on focus, add a new option, 'docID' to the field object.
For example, for the 'name' field on the add volume form, the doc JSON looks like this:
| No Format |
|---|
cloudStack.docs = {
// Add volume
helpVolumeName: {
desc: 'Give the volume a unique name so you can find it later.'
},\\
...
}\\
|
To
...
show
...
'helpVolumeName'
...
as
...
the
...
tooltip
...
for
...
the
...
name
...
field,
...
just
...
add
...
that
...
ID
...
in
...
the
...
docID
...
field:
| No Format |
|---|
\\ createForm: { title: 'label.add.volume', desc: 'message.add.volume', fields: { name: { label: 'label.name', docID: 'helpVolumeName', ... }, ... },\\ \ |
--Now
...
the
...
tooltip
...
content
...
will
...
show
...
up
...
when
...
the
...
name
...
text
...
input
...
has
focus,
...
and
...
disappear
...
when
...
blurred.
...
*
...
*
...
Note
...
that
...
this
...
document
...
only
...
specifies
...
how
...
the
...
UI
...
reads
...
the
...
tooltip
...
data.
...
Because
...
the
...
documentation
...
is
...
originally
...
in
...
XML
...
format,
...
a
...
new
...
conversion
...
script
...
needs
...
to
...
be
...
integrated
...
into
...
the
...
build
...
system,
...
that
...
will
...
(re)generate
...
the
...
docs.js
...
file
...
from
...
the
...
relevant
...
XML
...
tags.
Overview
Content Tools
Apps