Technical Solution: Non-Sequential Enumeration Binding in mapp View
Overview
Your challenge with non-sequential enumeration values [0=empty / 1=present / 6=ground / 7=polished / 31=deactivated] in mapp View dropdown boxes can be solved through two approaches: a dynamic dataProvider with converter mapping, or a global snippet/style-based solution for reusable bindings.
—
Solution 1: JSON dataProvider with Converter Function Block
This approach uses a compact dataProvider containing only valid enum values and maps the PLC enumeration through a converter function block.
Implementation Steps
1.1 Define Compact dataProvider (Content Reference)
Create a structured dataProvider in your Content file with value-text pairs for only the valid enumeration values:
<DataProvider id=”WorkpieceStatusProvider”>
<Structure>
<Property name=”value” type=”Integer” />
<Property name=”text” type=”String” />
</Structure>
<Data>
<Item value=”0” text=”Empty” />
<Item value=”1” text=”Present” />
<Item value=”6” text=”Ground” />
<Item value=”7” text=”Polished” />
<Item value=”31” text=”Deactivated” />
</Data>
</DataProvider>
Alternative JSON format (if using JSON-based dataProvider)
[
{“value”: 0, “text”: “Empty”},
{“value”: 1, “text”: “Present”},
{“value”: 6, “text”: “Ground”},
{“value”: 7, “text”: “Polished”},
{“value”: 31, “text”: “Deactivated”}
]
1.2 Create Converter Function Block
Implement a small function block in your PLC application to map the enum value to sequential indices (0-4) for selectedIndex 
FUNCTION_BLOCK FB_EnumToIndex
VAR_INPUT
enumValue : USINT; // Your workpiece status enum
END_VAR
VAR_OUTPUT
dropdownIndex : USINT; // Sequential index for dropdown
END_VAR
CASE enumValue OF
0: dropdownIndex := 0; // Empty
1: dropdownIndex := 1; // Present
6: dropdownIndex := 2; // Ground
7: dropdownIndex := 3; // Polished
31: dropdownIndex := 4; // Deactivated
ELSE
dropdownIndex := 0; // Default to Empty
END_CASE
1.3 Widget Binding
Configure the DropDownBox widget:
<Widget xsi:type=”widgets.brease.DropDownBox” id=”WorkpieceStatusDropdown”>
<Property name=”dataProvider” value=”$contentRoot.WorkpieceStatusProvider” />
<Property name=”selectedIndex” binding=”{PLC:AsGlobalPV:YourConverterFB.dropdownIndex}” />
<Property name=”enable” value=”true” />
</Widget>
Advantages:
- No empty lines in dropdown
- Direct bidirectional binding possible (with reverse converter for write-back)
- Clean separation of presentation and logic
—
Solution 2: Global Snippet/Style with Text Lookup
This approach uses global snippets or shared styles for reusable text lookup, suitable when dropdown is display-only.
Implementation Steps
2.1 Define Global Snippet Set (Logical View)
Create a snippet set in your logical view (e.g., Snippets/WorkpieceStatus.snippet)
<Snippet id=”status_0” type=”String”>Empty</Snippet>
<Snippet id=”status_1” type=”String”>Present</Snippet>
<Snippet id=”status_6” type=”String”>Ground</Snippet>
<Snippet id=”status_7” type=”String”>Polished</Snippet>
<Snippet id=”status_31” type=”String”>Deactivated</Snippet>
2.2 Expression Binding for Text Lookup
Use a TextOutput widget styled as a dropdown appearance with expression binding:
<Widget xsi:type=”widgets.brease.TextOutput” id=”WorkpieceStatusDisplay”>
<Property name=”value” binding=”{EXPR:
$source{PLC:AsGlobalPV:WorkpieceStatus} === 0 ? ‘#/Snippets/WorkpieceStatus/status_0’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 1 ? ‘#/Snippets/WorkpieceStatus/status_1’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 6 ? ‘#/Snippets/WorkpieceStatus/status_6’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 7 ? ‘#/Snippets/WorkpieceStatus/status_7’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 31 ? ‘#/Snippets/WorkpieceStatus/status_31’ :sad_but_relieved_face: ‘Unknown’
}” />
<Property name=”enable” value=”false” />
<Property name=”style” value=”dropdownStyle” />
</Widget>
2.3 Shared Style with Embedded dataProvider Reference
For multiple widgets, define a global style in Styles/GlobalStyles.css and reference the dataProvider:
/ *Custom style for status display* /
.statusDropdownStyle {
border: 1px solid #ccc;
padding: 5px;
background: white;
appearance: dropdown;
}
Then create a shared widget configuration file (.vis\) with the dataProvider reference that can be imported across pages.
Alternative: Disabled DropDownBox Approach
For display-only scenarios with dropdown appearance:
<Widget xsi:type=”widgets.brease.DropDownBox” id=”StatusDisplay”>
<Property name=”dataProvider” value=”\[
{‘value’: 0, ‘text’: ‘Empty’},
{‘value’: 1, ‘text’: ‘Present’},
{‘value’: 6, ‘text’: ‘Ground’},
{‘value’: 7, ‘text’: ‘Polished’},
{‘value’: 31, ‘text’: ‘Deactivated’}
\]” />
<Property name=”selectedValue” binding=”{EXPR:
$source{PLC:AsGlobalPV:WorkpieceStatus} === 0 ? ‘Empty’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 1 ? ‘Present’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 6 ? ‘Ground’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 7 ? ‘Polished’ :sad_but_relieved_face: $source{PLC:AsGlobalPV:WorkpieceStatus} === 31 ? ‘Deactivated’ : ‘Unknown’
}” />
<Property name=”enable” value=”false” />
</Widget>
—
Recommendation
For interactive dropdowns (user selection): Use Solution 1 with converter function block. This provides clean bidirectional binding and maintainable code structure.
For display-only status indicators: Use Solution 2 with snippets and expression binding for maximum reusability without PLC overhead.
Global dataProvider management: Store dataProvider definitions in a dedicated Content file (e.g., GlobalDataProviders.content) and reference via $contentRoot across all pages to avoid duplication.
Both solutions eliminate empty lines while maintaining professional code organization and avoiding hardcoded string arrays in your application logic.