HTML HMI can capture and display server values in many HTML elements, including input fields. The value will not affect the styling of the elements in any way, so your standard layout, look and feel can be maintained.
HTML element
Input Textbox

Formatted Data

Additionally, value formatting is supported for string, boolean and numeric data. Formatting options include:
  • Numeric values can be formatted, limiting decimal precision
  • Converting boolean values, so true can become YES
  • Values can be placed in strings such as "{0} ft/s." to render "125.2 ft/s."
  • Formatting can also be combined, so you can limit decimal precision and include the result within a string formatter
Raw Value
Formatted (float)
Raw Value
Formatted (bool)
Raw Value
Formatted (string)

<!-- 
The oas-tag-txt attribute fills the contents of an element with a server tag value.  

Using the config.formats, you can determine how that value is displayed.

The 'tag' setting picks the server tag to load.
The 'string' sets up a formatting string, replacing {0} with the server value.  As you can see, this formatting string can be HTML.
The 'float' lets you format floating point server values, determining the number of decimal places to display.
-->
<div id='fmt3' 
  oas-tag-txt='{"tag":"Ramp2.Value", 
    "config":{
      "formats":{
        "string":"flow: {0} gpm", 
        "float":"0.00"
      }
    }
  }'>
</div>

<!--
At its simplest you can fill an HTML element without additional formatting like this:
-->
<div id='fmt4' oas-tag-txt='{"tag":"Ramp2.Value"}'></div>