Quantity Input

Quantity Input is used to display the monetary values on the interface. There are three states of Quantity Input:


Presentation State

143,838 EA

Code Snippet

143,838 EA

Read Only State

Add the readonly boolean attribute on an input to prevent user input and style the input as disabled.

Code Snippet

Editable State

If we are not using the type="number" HTML5 attribute, then we should use the inputmode attribute which gives the browser a hint for which keyboard to display. A HTML5 number field does not support characters such as commas which is required in this design.

Code Snippet

Pezzi Component

Component input parameters

Parameter Values Default Functionality
container String N/A jQuery selector where component will be rendered
state Vendavo.componentModes.FORM_WRITE , Vendavo.componentModes.FORM_READ, Vendavo.componentModes.PRESENTATION N/A It refers how a component is rendered, see above state section
value Number N/A Actual value displayed in component
negative Boolean false Enable/Disable negative sign
precision Integer 0 Precision for formating of number
delimiter ',' '.' '.' Delimter which should be used during input
formMode mixin Used for keeping information for state FORM_WRITE
formMode.items Array of Objects [{key: 'PD', label: 'Label 1'}, ...] these items will be displayed in selector
formMode.default String If value mach with any key in formMode.items then that record is pre-selected. Otherwise the first item is selected.
label String Used in FORM_READ/PRESENTATION. Contains Quanity label displayed next to number.
onMeasureChange function Callback on measure change event
onValueChange function Callback for value change event
locales Array [en-US] Locales used for formatting of numbers

Playground With Examples