SAP UI5 TimePicker Behaviour | Formatting not Working with OdataV4 on RemoteService

37 Views Asked by At

since the SAP Community Forum is down for a few days i switched to Stackoverflow. While im by no means new to UI5 having answered questions before regarding sapui5 im new here on StackOVerflow, so hello dear StackOverflower

To my question: I am currently refactoring a ui5 app which doesnt write on a hana db but to a Custom Businness Object on a S4Hana ERP. The App didnt use any bindings before and this might seem easy to change at first glance. but somehow this doesnt appear to be the case. The APP has a SAP CAP as a layer between writing to the actual custom business object

The binding itself on an Odatamodel v4 works fine but formatting a Timevalue in any shape or form is failing completly. I always get the default Input mask off HH:mm:ss

Heres what i already Tried

Using the official Docs:

                        <TimePicker
                            id="idTimePickerEnd"
                            value="{
                                path: '/EndTime',
                                type: 'sap.ui.model.type.Time',
                                formatOptions: {
                                    source: {
                                        pattern: 'HH.mm'
                                    }
                                }
                            }"
                            placeholder="{i18n>end}"
                            width="100%"
                            change="onSelectDurationChange"
                        />

Okay Odatav4 supports only TimeOfDay instead of Time so i adapted it

                        <TimePicker
                            id="idTimePickerEnd"
                            value="{
                                path: 'EndTime',
                                type: 'sap.ui.model.odata.type.TimeOfDay',
                                formatOptions: {
                                    source: {
                                        pattern: 'HH.mm'
                                    }
                                }
                            }"
                            placeholder="{i18n>end}"
                            width="100%"
                            change="onSelectDurationChange"
                        />

Next try using a different way to format.

                        <TimePicker
                            id="idTimePickerEnd"
                            value="{path:'EndTime', type:'sap.ui.model.odata.type.TimeOfDay'}"
                            displayFormat="HH.mm"
                            valueFormat="HH.mm"
                            placeholder="{i18n>end}"
                            width="100%"
                            change="onSelectDurationChange"
                        />

This here works on JSON Models btw:

                        <TimePicker
                            id="idTimePickerEnd"
                            value="{
                                path: '/EndTime',
                                type: 'sap.ui.model.type.Time',
                                formatOptions: {
                                    source: {
                                        pattern: 'HH.mm'
                                    }
                                }
                            }"
                            placeholder="{i18n>end}"
                            width="100%"
                            change="onSelectDurationChange"
                        />

Ok that doesnt work aswell.

Here some Interesting facts i noticed while Debugging. The Exported Remote Service CSN file has this definition this seemed somewhat unexpected, but it shouldnt affect my issue since the ui5 component is not writing directly to the service but to cap first.

    "StartTime": {
     "type": "cds.Time",
     "@sap.label": "StartTime"
    },

But on the on the Cap service it looks like this. This is expected with some sort of formatting i should be able to get the Time in the required formats of the other service definitions

<Property Name="EndTime" Type="Edm.TimeOfDay"/>

The easiest way to circumvent this issue would be to parse the date in the cap service, but that solves only half the equation, i still need a way to remove the seconds from the input of TimePicker, since those wont be needed.

I know this app should run at a hana at some point but that isnt in my control

So is there any way to do this without having to develop a custom control? Any advice would be appreciated

0

There are 0 best solutions below