Usage
<div id="button" ui-type="Button" ui-action="none" ui-transparent-border="false" ui-primary="false"></div>
<div id="numericBoxKG" ui-type="NumericBox"
ui-focus-group-id="1" ui-focus-group-first="true" ui-button-id="button"
ui-placeholder="KG" ui-show-buttons="false" ui-vertical-buttons="true"
ui-min-value="0" ui-max-value="100" ui-incremental-value="1" ui-max-length="2">
</div>
<div id="numericBoxG" ui-type="NumericBox"
ui-focus-group-id="1" ui-button-id="button"
ui-placeholder="G" ui-show-buttons="true" ui-vertical-buttons="true"
ui-rounding="1" ui-precision="2" ui-min-value="0" ui-max-value="999"
ui-incremental-value="0.1">
</div>
const button = $UI.createComponent(componyx.UI.Button, {
id: 'button',
action: componyx.UI.Button.ActionOption.NONE,
transparentBorder: false,
primary: false,
containerElement: document.body
});
button.show();
const numericBoxKG = $UI.createComponent(componyx.UI.NumericBox, {
id: 'numericBoxKG',
focusGroupId: '1',
focusGroupFirst: true,
buttonId: button.id,
width: '50px',
placeholder: 'KG',
showButtons: false,
verticalButtons: true,
minValue: 0,
maxValue: 100,
incrementalValue: 1,
maxLength: 2,
containerElement: document.body
});
numericBoxKG.show();
const numericBoxG = $UI.createComponent(componyx.UI.NumericBox, {
id: 'numericBoxG',
focusGroupId: '1',
buttonId: button.id,
width: '75px',
placeholder: 'G',
showButtons: true,
verticalButtons: true,
rounding: componyx.UI.NumericBox.RoundingOption.ROUND,
precision: 2,
minValue: 0,
maxValue: 999,
incrementalValue: 0.1,
containerElement: document.body
});
numericBoxG.show();
rounding accepts the numeric componyx.UI.NumericBox.RoundingOption
enum: 0 None, 1 Round, 2 Floor, 3 Ceil. It only applies together with precision,
which sets how many decimal places the value is constrained to, None leaves the typed
value untouched, Round rounds to the nearest value at that precision, Floor always rounds
down and Ceil always rounds up.