Skip to content

Commit 4473122

Browse files
authored
add formatter
1 parent 47659ba commit 4473122

File tree

2 files changed

+129
-0
lines changed

2 files changed

+129
-0
lines changed

docs/.vitepress/config.mjs

+1
Original file line numberDiff line numberDiff line change
@@ -112,6 +112,7 @@ export default defineConfig({
112112
{ text: 'Geolocation, Maps', link: '/development/specific/geolocation' },
113113
{ text: 'Stateful Sessions', link: '/development/specific/stateful' },
114114
{ text: 'URL', link: '/development/specific/url' },
115+
{ text: 'Formatter', link: '/development/specific/formatter' },
115116
]
116117
},
117118
]
+128
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
# Formatter
2+
3+
You can format values like Currencies, Numerics or Times directly at the frontend with formatter functions:
4+
5+
```abap
6+
7+
CLASS z2ui5_cl_demo_app_067 DEFINITION PUBLIC.
8+
9+
PUBLIC SECTION.
10+
INTERFACES z2ui5_if_app.
11+
12+
DATA amount TYPE p LENGTH 14 DECIMALS 3.
13+
DATA currency TYPE string.
14+
DATA numeric TYPE n length 12.
15+
16+
DATA check_initialized TYPE abap_bool.
17+
18+
PROTECTED SECTION.
19+
20+
PRIVATE SECTION.
21+
ENDCLASS.
22+
23+
24+
CLASS z2ui5_cl_demo_app_067 IMPLEMENTATION.
25+
26+
METHOD z2ui5_if_app~main.
27+
28+
IF check_initialized = abap_false.
29+
check_initialized = abap_true.
30+
31+
numeric = '000000000012'.
32+
amount = '123456789.123'.
33+
currency = `USD`.
34+
35+
ENDIF.
36+
37+
CASE client->get( )-event.
38+
WHEN 'BACK'.
39+
client->nav_app_leave( client->get_app( client->get( )-s_draft-id_prev_app_stack ) ).
40+
ENDCASE.
41+
42+
DATA(page) = z2ui5_cl_xml_view=>factory( )->shell(
43+
)->page( title = 'abap2UI5 - Currency Format'
44+
navbuttonpress = client->_event( 'BACK' )
45+
shownavbutton = xsdbool( client->get( )-s_draft-id_prev_app_stack IS NOT INITIAL ) ).
46+
47+
page->simple_form( title = 'Currency'
48+
editable = abap_true
49+
)->content( 'form'
50+
)->title( 'Input'
51+
)->label( 'Documentation'
52+
)->link( text = 'https://sapui5.hana.ondemand.com/#/entity/sap.ui.model.type.Currency'
53+
href = 'https://sapui5.hana.ondemand.com/#/entity/sap.ui.model.type.Currency'
54+
)->label( 'One field'
55+
)->input(
56+
|\{ parts: [ '{ client->_bind_edit( val = amount
57+
path = abap_true ) }', '{ client->_bind_edit(
58+
val = currency
59+
path = abap_true ) }'], type: 'sap.ui.model.type.Currency' \}|
60+
)->label( 'Two field'
61+
)->input(
62+
|\{ parts: [ '{ client->_bind_edit( val = amount
63+
path = abap_true ) }', '{ client->_bind_edit(
64+
val = currency
65+
path = abap_true ) }'], type: 'sap.ui.model.type.Currency' , formatOptions: \{showMeasure: false\} \}|
66+
)->input(
67+
|\{ parts: [ '{ client->_bind_edit( val = amount
68+
path = abap_true ) }', '{ client->_bind_edit(
69+
val = currency
70+
path = abap_true ) }'], type: 'sap.ui.model.type.Currency' , formatOptions: \{showNumber: false\} \}|
71+
)->label( 'Default'
72+
)->text(
73+
|\{ parts: [ '{ client->_bind_edit( val = amount
74+
path = abap_true ) }', '{ client->_bind_edit(
75+
val = currency
76+
path = abap_true ) }'], type: 'sap.ui.model.type.Currency' \}|
77+
)->label( 'preserveDecimals:false'
78+
)->text( |\{ parts: [ '{ client->_bind_edit( val = amount
79+
path = abap_true ) }', '| && client->_bind_edit(
80+
val = currency
81+
path = abap_true ) &&
82+
|'], type: 'sap.ui.model.type.Currency' , formatOptions: \{ preserveDecimals : false \} \}|
83+
)->label( 'currencyCode:false'
84+
)->text( |\{ parts: [ '{ client->_bind_edit( val = amount
85+
path = abap_true ) }', '| && client->_bind_edit(
86+
val = currency
87+
path = abap_true ) &&
88+
|'], type: 'sap.ui.model.type.Currency' , formatOptions: \{ currencyCode : false \} \}|
89+
)->label( `style:'short'`
90+
)->text(
91+
|\{ parts: [ '{ client->_bind_edit( val = amount
92+
path = abap_true ) }', '{ client->_bind_edit(
93+
val = currency
94+
path = abap_true ) }'], type: 'sap.ui.model.type.Currency' , formatOptions: \{ style : 'short' \} \}|
95+
)->label( `style:'long'`
96+
)->text(
97+
|\{ parts: [ '{ client->_bind_edit( val = amount
98+
path = abap_true ) }', '{ client->_bind_edit(
99+
val = currency
100+
path = abap_true ) }'], type: 'sap.ui.model.type.Currency' , formatOptions: \{ style : 'long' \} \}|
101+
)->label( 'event'
102+
)->button( text = 'send'
103+
press = client->_event( 'BUTTON' ) ).
104+
105+
page->simple_form( title = 'No Zeros'
106+
editable = abap_true
107+
)->content( 'form'
108+
)->title( 'Input'
109+
)->label( 'Documentation'
110+
)->link( text = 'https://sapui5.hana.ondemand.com/sdk/#/api/sap.ui.model.odata.type.String%23methods/formatValue'
111+
href = 'https://sapui5.hana.ondemand.com/sdk/#/api/sap.ui.model.odata.type.String%23methods/formatValue'
112+
)->label( 'Numeric'
113+
)->input( value = client->_bind_edit( val = numeric )
114+
115+
)->label( `Without leading Zeros`
116+
117+
)->text(
118+
text = |\{path : '{ client->_bind_edit(
119+
val = numeric
120+
path = abap_true ) }', type : 'sap.ui.model.odata.type.String', constraints : \{ isDigitSequence : true \} \}| ).
121+
122+
client->view_display( page->stringify( ) ).
123+
124+
ENDMETHOD.
125+
126+
ENDCLASS.
127+
128+
```

0 commit comments

Comments
 (0)